1

FireFox（17.0.1）は、テーブルセルの表示と、親の幅を設定し、親の幅に浮動要素の幅を含まない浮動要素を使用しているときに、幅を正しく計算していないようです。これは、Chrome、IE8、IE9、およびIE10で機能するようです。

   <div style="position:absolute">
    <div style="position:relative">
        <div class="option">
            <div>
                <div class="right">right text</div>
                <div class="cell">content item 1</div>
            </div>
        </div>
        <div class="option">
             <div>
                 <div class="right">right</div>
                 <div class="cell">content</div>
             </div>
        </div>
    </div>
</div>
<style>
    .right {float:right;}
    .cell
    {
        display:table-cell;
        height:30px;
        vertical-align:middle;
        border:1px solid green
    }
</style>​

可能であれば、これは既存のものであるため、CSSのみの修正を探しています。一部のHTMLは意味をなさないかもしれませんが、例をわかりやすくするために90％を削除しました。

一部の親要素でdisplay：table、display：table-rowが必要なテーブルセルのバグに気づきましたが、機能する組み合わせが見つかりませんでした。

また、幅をハードコーディングしないようにしています。

4

1 に答える 1

2

コンテナdivを削除float: right; して追加することで、あなたの生活を楽にしてください。display: table-row;

http://jsfiddle.net/Riskbreaker/u9RU4/1/

私はこれをFF-Chrome-IE9とIE8-とSafariでテストしました。......それはあなたがフロートを必要としない限りです....

于 2013-01-02T19:14:35.810 に答える