html - 横線でフォームを区切る方法

Question

私のhtmlページには、cssを使用したdivがあります:

padding: 0px;
color: rgb(51, 51, 51);
background: none repeat scroll 0% 0% rgb(255, 255, 255);
position: relative;
overflow: visible;

このdivには、フォームと水平線があります:

<hr color="#424242" size="2">

form の後にこの行を追加するにはどうすればよいですか? 彼の例はより大きなディスプレイで動作しますが、電話回線で自分のページを見るとdivの隣にあります

score 0 · Accepted Answer

のような表示的で非標準的なマークアップを使用する特別な理由がない限り<hr color="#424242" size="2">、この要素を省略し、代わりに CSS を使用してform要素の下の境界線を描画します。

form {
  border-bottom: solid #424242 2px;
}

padding-bottom必要に応じて、このルールにand/orを追加margin-bottomして、行の前後にそれぞれ垂直方向の間隔を作成します。

マークアップを使用する必要がある場合は、質問に対する私のコメントを参照してください。しかし、問題の原因が何であれ、CSS のアプローチではそれを回避する必要があります。なぜなら at はform要素に水平線を追加するからです。

score 0 · Accepted Answer

次の CSS を使用できます。

clear: both;

div をクリア (または下に移動) するには、別の要素を使用します。

これはあなたが意味するものですか？

score -1 · Accepted Answer

hr {
border-bottom: 1px solid #424242;
clear: both;
display: block;
margin-bottom: 10px;
padding-top: 10px;
width: 100%;

}

3 に答える 3