1

私は次のようなコードを持っています

<div id="container" >
     <div id="content"></div>                               
    <table id="link" cellspacing=0px; cellpadding=0px;>
    </table>    
</div>

CSSで

#contentDiv {
    width: 100%;
    height:100%;
    margin: 0;
}

#content {
    width:90%;
    height:60%;
    margin-left:20px;   
    display: inline;    
    vertical-align: left;
    z-index:40;

}
#link {
    width:30%;
    height:50%;
    margin: 0;
    margin-top:10px;
    margin-right:10px;
    float: right;
    z-index:70;

}

のように表示したい ここに画像の説明を入力

テーブルの上に絶対divが浮かんでいない

しかし、そのように表示されていないので、助けていただければ幸いです。

4

4 に答える 4

1

フローティング div を使用しますleft-marginが、div を負の数にして、テーブル上で「フロート」します

于 2013-09-26T12:49:05.843 に答える
0

最初:container要素はありますが、それに関連付けられた CSS ステートメントはありません。また、contentDivCSS ステートメントはありますが、対応する HTML 要素はありません。

2 番目: davblayn が述べたように、負のmargin-left値を使用できます。

#link {
    ...
    margin-right:-40px;
    ...
}

こちらの例を参照してください (JSFiddle)。

于 2013-09-26T12:53:39.830 に答える
0

例えば：

CSS:

#container {
    width: 100px;
    height: 100px;
    float: left;
    background-color: red;
}

#content {
    width: 60px;
    margin-right: -30px;
    height: 60px;
    float: right;
    background-color: green;

 }

HTML:

<div id="container">
   <div id="content"></div>
</div>

正常に動作します。

于 2013-09-26T12:51:25.990 に答える
0

display各テーブル要素のプロパティを に変更するblockと、テーブルが強制的にブロック モードに戻り、すべて正常に動作します。

<div style="float:right;background:red;width:200px;">This is a test.</div>
<table style="display:block;background:green;">
<tr style="display:block;">
<td style="display:block;">
This is a very long string. This string should break to the next line instead of spanning across like usual.
</td>

于 2017-07-19T00:16:13.897 に答える