css右边的右边100%对齐div

时间:2012-08-16 21:05:31

标签: css html css-float alignment

我的表格设置为100%宽度。我会添加一个随机的div,其中有时会充满广告。我希望广告div在右边和表格的内容。我希望桌子在左边,但仍然在100%左右,它将填充广告div左侧的所有空间。

简而言之,所以当div不存在时,表格将填充100%的宽度。 当div存在时,div将位于表格的右侧,设置宽度为300px。

这是div的风格

.ContentAds {
    float: right;
    height: 100%;
    width: 300px;
    display: block;
    clear: none;
}

该表不是div,只是设置为100%宽度。

<table width="100%" border="0" align="left" cellpadding="0" cellspacing="0">
  <tr>
    <td><p class="Title">Title</p>
    <p>This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content. This is the content.. </p></td>
  </tr>
</table>

2 个答案:

答案 0 :(得分:2)

现在我只能建议用一个定位的div包装你的表。但是我不能确定你提供相当少量的代码就足够了 jsfiddle

<div class="ad">
    advertise... advertise
    advertise... advertise
    advertise... advertise
</div>
<div class="table_wr">
    <table>
        <tr>
            <td>
                <p class="Title">Title</p>
                <p>
                    This is the content. This is the content.
                    This is the content. This is the content.
                    This is the content. This is the content.
                    This is the content. This is the content..
                </p>
            </td>
        </tr>
    </table>
</div>

CSS

body {
    position: relative;
}
table {
    border: 1px solid black;
    width: 100%;
}
.ad {
    float:right;
    width:300px;
    height: 500px;
    background-color: #a2e89f;
}
.table_wr {
    position: absolute;
    left: 0;
    right: 300px;
}

为表格设置了边框,您可以看到表格拉伸的位置

答案 1 :(得分:0)

我认为除非你在另一个DIV存在时给表设置较小的设置宽度然后你可以将它浮动到左边,否则这将不起作用。

也许您可以将表设置为100%然后当其他DIV在那里时,您在表上添加一个类来调整宽度并浮动它?