要素のセレクタが1行で単独で使用されていますか？

2つの子要素を持つフレックスコンテナがあります。要素のセレクタが1行で単独で使用されていますか？

フレックスアイテムラップの1つをサイズ変更すると、各要素が独自の行になります。

:when-alone-in-rowのようなセレクタはありますか？

.flex-parent {flex-flow: row wrap} 
    .flex-child 
    .flex-child

出典

2016-09-26 Vanyatwo

いいえ、ありません。 –

CSSのメディアクエリで尋ねるものに似たものを手に入れることができるかもしれません。 –

*あなたのHTMLを表示してください。ほとんどの場合、言語は構造を適切に記述するためにあまりにもあいまいです。「* [MCVE] *」（および「* [ask] *」）のガイドラインをご覧ください。 –

いいえ、:when-alone-in-rowに似たセレクタはありません。

ただし、2つのフレックスアイテムしか扱っていないため、兄弟グループの最初と最後の要素を選択する場合は、:first-childと:last-child疑似クラスを使用できます。

もちろん、これらのセレクタによって適用されるスタイルは、メディアクエリに適用されない限り、両方のアイテムが同じ行にある場合でも機能します。

出典

2016-09-26 14:02:03

フレックスラップが機能するとき、アイテムの幅を知り、ラップするタイミングと各エレメントラップ位置のステータスを認識します。私はその知識を使いたいと思います:) 最初の子/：last-child /：nth-childを使用すると、応答としてクライアントを知らなくてもクエリーとして "バックエンド"ソリューションになりますレイアウト、それは "ハードコード"ですが、今は最大限の応答性の高いコードが必要です。 – Vanyatwo

JavaScriptを使用する必要があるかもしれません。 –

私は明確なCSSを使用することを好みます...フレックスは表示のようにゴミ箱になります：テーブルや他の「良い」ソリューション:( – Vanyatwo

同じ画面サイズで常に折りたたまれている場合は、メディアクエリを使用して、スタイルが自分の行にあるときに調整することができます。

もしそうでない場合は、折りたたみのためにメディアクエリを使用する価値があるかもしれませんので、あなたの行/列をより良くコントロールすることができます。

出典

2016-09-26 15:03:23 JakeSidSmith

応答依存のコンテンツ独立コードを作成しようとすると、デバイス依存コードだけが良いクエリになります – Vanyatwo

ああ、大丈夫です。申し訳ありませんが、私はもっと助けることができませんでした。 – JakeSidSmith

要素のセレクタが1行で単独で使用されていますか？

答えて

関連する問題