Question

我希望我的左边div取左边的宽度，右边的div有一个不会改变的设置宽度，如下所示：

HTML：

<link rel="stylesheet" type="text/css" href="css/topic.css">
        <div id="topic">
            <div class="post_right"></div>
            <div class="post_left">
                <div class="post_header">
                    <ul style="padding: 0px; margin: 0px; display: inline-block;">
                        <li>
                            <img src="images/eduardo_img.jpg" height="30px">
                            <span style="vertical-align: bottom;">Administrator</span>
                        </li>
                        <li>
                            Group name here
                        </li>
                    </ul>
                    <span style="float: right;">
                        <img src="images/thumb_up.png" height="30" /> 12
                        <img src="images/thumb_down.png" height="30" /> 2
                    </span>
                </div>
                <div class="post_body"></div>
                <div class="user_signature"></div>
            </div>



        </div>

CSS：

#topic{
    width: 100%;
    overflow: hidden;
    border: 1px solid;
    min-height: 200px;
}
.post_left{
    border: 1px solid;
    overflow: hidden;
    display: inline-block;
    min-height: 20px;
    margin: 10px;
}
.post_header{
    height: 30px;
    padding: 5px;
    border: 1px solid;
}
.post_right{
    border: 1px solid;
    width: 300px;
    float: right;
    display: inline-block;
    height: 20px;
    margin: 10px;
}
.post_body{
    height: 200px;
    border: 1px solid;
    margin: 10px;
}
.post_header li{
    vertical-align: bottom;
    padding-left: 10px;
    padding-right: 10px;
    border-right: 1px solid;
}
.post_header li:last-child{
    border: 0px;
}

左边的div需要一个设定的宽度，中间有一个巨大的空白空间，我该怎么解决这个问题呢？谢谢！

Answer 1

修正了它！我所要做的就是从Display: inline-block; div

中删除.post_left

使左div占据宽度的其余部分

1 个答案: