0

参考：これは別の質問へのフォローアップです：要素を絶対に配置しますが、別の要素の右側に配置します

フォーム要素のリストがあり、それぞれに吹き出しを追加しようとしています。各フォーム エントリには、次の一般的な形式があります。

<li>
    <input ...>
    <div class='callout'>Helpful description about form item.</div>
</li>

.callouthasposition:absoluteとhasは、コールアウトを LI に対して「絶対的に」配置できるようにするためのものですLI。position:relative

それはすべて正常に機能しますが、問題はの祖先の1つにもいくつかのフロートが含まれているため、overflow:hiddenそれらが含まれていることを確認するためにそのトリックを使用しました. 残念ながら、それはまた、コールアウトが外側に伸びているため、コールアウトが切断されていることも意味します.

フォールバックは、その祖先の最後に空の div をドロップしてそれを行うclear:bothことだと思いますが、祖先にフロートを強制的に含めるが、絶対に配置されたコールアウトを外側に表示できるようにする、より優れた CSS ソリューションはありますか?箱？

4

1 に答える 1

1

代わりにclearfixメソッドoverflow:hiddenを使用できます。次のように書きます。

li:after{
 content:'';
 display:block;
 clear:both;
}
于 2012-05-09T13:21:38.887 に答える