html - UL リストに大きなギャップがあるのはなぜですか?

Question

HTMLリストのスタイリングを整理しようとしていますが、なぜこれが起こっているのかわかりません。

UL html リストの上に大きなギャップがあるようですが、どうすれば削除できますか?

score 1 · Accepted Answer

次のスタイルを設定します。

ul{
margin: 0;
padding: 0;
}

お使いのブラウザはデフォルトで UL マージンを追加しています - デフォルトのブラウザをリセットする必要がありますCSS

score 1 · Accepted Answer

ルール宣言に追加margin:0します。.content-list

<br />ところで、<ul>タグを使用することはできません。それは無効なマークアップです

score 1 · Accepted Answer

これは、デフォルトでuls に of があるためmargin-topです40px(Chrome では、ブラウザによって異なります)。margin: 0pxあなたに設定するulと、それが修正されます：

ul {
    margin: 0px;
}

score 0 · Accepted Answer

UL content-list のマージンは 14 です。ブラウザの開発者ツールで特にクロムで要素を調べると、サイドツールのメトリックに間隔の値が表示されます。margin:0px; を設定するだけです。そのULスタイルとそのギャップはなくなります。

4 に答える 4