Question

所以我有3个Div。左，右中。

如果浏览器尺寸小于中心最小宽度，则会下降。视频：

我不知道我错了什么，所以很多人试图帮助我+我搜索它但我没有找到任何东西。这是代码：

HTML：

<div id="parent">
    <div id="left"></div>
    <div id="right"></div>
    <div id="center"></div>
</div>

CSS：

#parent
{
margin-left: 5%;
margin-right: 5%;
position: fixed;
top: 50px;
bottom: 50px;
left: 0;
right: 0;
overflow: auto;
}

#left {
position: relative;
width: 370px;
height: 100%;
float: left;
background: #093F5C;
overflow: hidden;
}
#right {
position: relative;
width: 230px;
height: 100%;
float: right;
background: #093F5C;
overflow: auto;
}
#center {
height: 100%;
min-width: 550px;
overflow: auto;
}

Answer 1

#center应该有一个最大宽度：550px，而不是最小宽度：550px。您也可能还想为其添加宽度。

#center {
    height:100%;
    max-width:550px;
    width:100%;
    overflow:auto;
}

一般来说，你的CSS也有很多其他奇怪的东西，但这超出了这个问题的范围......有些事情要考虑 - 为什么#parent有position:fixed？为什么其他一切position:relative？为什么你的高度为100％？

Answer 2

也许...

#left {
   position: absolute;
   left:0px;
   top: 0px;
   width: 370px;
   height: 100%;
   background: #093F5C;
   overflow: hidden;
}

#right {
  position: absolute;
  right:0px;
  top:0px;
  width: 230px;
  height: 100%;
  background: #093F5C;
  overflow: auto;
 }

 #center { 
   height: 100%;
   position:absolute;
   left: 370px; /*width of leftDiv */
   right: 230px; /*width of rightDiv */
   top:0px;
   /*min-width: 100px;*/
   overflow: auto;
   background: red;
}

jsfiddle：http://jsfiddle.net/alemarch/35bxtc2z/7/（我已经更改了左右div的固定尺寸）。这是你搜索的内容吗？

3 div（左，中，右），如果大小＆lt; div下降最小宽度

2 个答案: