Question

我有一个容器div和3个内部div，它们都放在一行中。侧面div具有固定宽度，我想要中间div的自动宽度。这是我的代码：

<div style="width: auto; height: 25px; position: relative; float: right;">
    <div style="width: 25px; height:25p; float: right; position: relative; display:inline-block;">
    <div style="width: auto; height: 25px; position: relative; float: right; display:inline-block;"></div>
    <div style="width: 25px; height:25p; float: right; position: relative; display:inline-block;">
</div>

...但是中间div不占用任何空间。

注意：我不希望容器div具有固定或百分比大小。

解决方案是什么？

Answer 1

您没有关闭容器中的第一个和最后一个div。你需要那个。我做了jsFiddle，我认为这是你需要的。这是代码：

<style>
div {
    width: auto;
    height: 25px;
    position: relative;
    float: right;
}
div div {
    float: left;
    display:inline-block;

}
div div:first-child {
    float: left;
    width: 25px;
}
div div:last-child {
    width: 25px;
    float: right;
}
</style>

<div>
<div>1</div>
<div>This is the second and middle div.</div>
<div>3</div>
</div>

Answer 2

我以前遇到过同样的问题。我花了很多时间玩，幸运的是这是一个简单的解决方法：

<style>
div1{
float: left;
width: 200px;         /* ...Or whatever fixed width you want */
}

div2{
overflow: hidden;    /* This will automatically set this div's width to the remainder */
}
</style>

希望有所帮助。

HTML div自动宽度

2 个答案: