2

私はjsfiddleに次のHTMLとCSSを持っています:

<div class="MyBox">

    <div class="TopText">text here</div>    
    <div class="MyText">text</div>
    <div class="MyText">text</div>
    <div class="MyText">text</div>
    <div class="MyText">text</div>
    <div class="MyText">text</div>
    <div class="OtherText1">text1</div>
    <div class="OtherText2">text2</div>

​&lt;/div>
.MyBox{
    padding:10px 10px;
    position:absolute;
    margin:10px 0px;
    ​border:5px solid black;}

.TopText{clear:right;}

.MyText{
    float:left;
    margin:10px 10px;}

.OtherText1{
    clear:left;
    float:left;
    margin:10px 10px;}

.OtherText2{
    float:left;
    margin:10px 0px 10px 50px;}

クラスMyBoxのdivは絶対に配置する必要があります。問題は、コンテナdivにOtherText divがない場合、MyBox divのサイズが適切に設定されることですが、これらのdivがある場合、コンテナdivは幅を追加することでサイズが変更されるようです。この問題はChromeでのみ発生するようですが、これはかなり奇妙なことです。

どうすれば修正できますか?

ありがとう。

4

2 に答える 2

4

非常識なトリック:余分なシュリンクラップパワーのためfloat:leftに絶対位置に追加します:MyBox

http://jsfiddle.net/SyKfm/2/

.MyBox {
    position:absolute;
    float: left;

数日前に同様の質問がありましたが、腹筋がありました。配置された最大幅div:

スマート幅を分割

于 2012-06-28T16:58:45.790 に答える
0

なぜそれが起こっているのですか?よくわかりませんが、どうすれば修正できますか?最適ではないことはわかっていますが、<div style="clear:both"></div>2'othertexts'の前にaを追加できます。たぶん、問題は同じ要素にクリアとフロートがあることに関係していますか?わからない。

于 2012-06-28T16:57:37.080 に答える