0

td基本的に、私は自分の s を水平方向に離して配置したいと考えています。Firefox ではマージンを設定することで問題なく動作しますが、クロムではマージンが機能しません。そこで、次のことを試してテーブルに適用しました

border-spacing: 40px;
border-collapse: separate;

さらに、そのソリューションはクロムでは機能しましたが、Firefox では機能しませんでした。border-collapse:ガイドでは、firefox で動作させるには別のものが必要であると示唆されていましたが。

これ以上の詳細は省きますが、テーブルのスタイリングのコード (Firefox で動作するもの) は次のとおりです。

#tstyle3 {
    margin: 10px 0 0 0px;
    width: 750px;
    border-collapse: separate;
}

#tstyle3 tr {
    height: 270px;
    border-bottom: none;
    border-collapse: separate;
    width: 950px;
    display: inline-block;
}

#tstyle3 td {
    border-top: none;
    display: inline-block;
    position: relative;
    border-collapse: separate;
    margin: 0 30px 0 0;
    height: 220px;
    width: 220px;
    background-color: white;
    float: left;
    box-shadow: 0px 3px 5px #b5b6b6;
}

そして、jsfiddle で再現された状況 (これは、Firefox でどのように表示されるかを示しています)

http://jsfiddle.net/JjZNb/

4

3 に答える 3

2

もっとセクシーなことを試してみませんか？

float:left; display:block;

http://jsfiddle.net/JjZNb/1/

于 2013-02-08T01:57:53.957 に答える
0

境界線のサイズまたは td 要素のパディングを指定することで、間隔を追加できます。

td{border:8px solid #fff;}

またはパディング用

td{padding:0 10px;}

または境界線のスタイルが既に定義されている場合、

td{border-width:2px;}

または各側

td{border-width:0 2px 0 2px;}
/* top right bottom left*/

これは、上記のhttp://jsfiddle.net/VjkP9/を示す jsFiddle です。

于 2013-02-08T02:23:04.020 に答える
0

マージンは td 要素では機能しません。

それは正しくありません。マージンは表のセルでは機能しません (したがって、要素はです。しかし、上記の CSS は要素をでdisplay:table-cellスタイル設定するため、それらはもはや表のセルではなく、マージンを適用する必要があります。<td>display: inline-block

于 2013-02-08T10:44:04.977 に答える