css - Flex レイアウトの問題

Question

ヘッダーはフレックス レイアウトを使用しています。ネイティブ IOS のレイアウトと同様に、検索ボックスを水平方向の中央に配置したいです。

---

左右の内容に影響されず、水平方向の中央揃えになります
以前実装した記憶があるのですが、flex.cssを使っているときに忘れてしまいました。これで達成できます

Answer 1

リーリー

Flex レイアウトの詳細については、こちらをご覧ください: http://www.ruanyifeng.com/blo...

Answer 2

space-between を使用して直接展開できるのは 3 つの要素のみです

https://jsfiddle.net/straybug...

---

後で更新しました

左右のコンテンツの影響を受けず、水平方向の中央に配置されます

影響を受けないので、唯一の方法は絶対値を抽出して中央に配置することです。

https://jsfiddle.net/straybug...

Answer 3

主に使用しますalign-items: center
これはデモです

Answer 4

中央の位置に絶対位置を使用します。左右の幅が異なる場合は、中央の位置に影響します。 リーリー