BinaryDevelop
  1. ホーム
  2. html

[解決済み] 順序なしリストを中央揃えにするには？

2022-03-09 20:28:01

質問

幅が未知の順序なしリストを中央揃えにして、リスト項目を左揃えにする必要があります。

これと同じ結果になるようにする。

HTML 

<div>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

CSS 

div { text-align: center; }
ul { display: inline-block; text-align: left; }

ただし、私の <ul> は親 div を持ちません。 ul { margin: 0 auto; } は幅が固定されていないのでうまくいきません。 ul { text-align: center; } というのは、リストアイテムが左揃えにならなくなるからです。では、どうすればこの <ul> を維持したまま <li> を左揃えにする（親divのラッパーを持たない）？ 

<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

EDIT : 私の表現が悪かったのかもしれませんが...。最初のコードのブロックはすでに動作しています...必要なのはそれを行うことです。 なし その <div> のラッパーで、もちろんそれが可能であればですが。フロート・トリック？疑似要素トリック？何か方法があるはずだ。

どうやって解決するの？ 

ul {
  display: table;
  margin: 0 auto;
}

<html>

<body>
  <ul>
    <li>56456456</li>
    <li>4564564564564649999999999999999999999999999996</li>
    <li>45645</li>
  </ul>
</body>

</html>

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します