Question

所以，我正在制作一个带有2个简单侧边栏的页面，一个在左边，一个在右边。问题是，侧边栏的高度取决于其内容，页面也是如此。因此，如果页面内容比侧边栏内容短，则它不会显示单个矩形\ square，但会显示比页面长的侧边栏矩形。另一方面，如果页面内容比侧边栏长，它将扩展矩形并且还扩展＆＃34;侧边栏空白，但是，该空白是页面而不是侧边栏。页面结构如下：

<div id="page">
    <div id="sidebar1">
    </div>
    <div id="sidebar2">
    </div>
    <div id="pageContent">
    </div>
</div>

Answer 1

使用display:inline-block;和Width Demo Here

＆＃13;

#sidebar1{
  display:inline-block;
  width:24%;
  background:red;
  height: 300px;
}

#sidebar2{
   display:inline-block;
   width:24%;
    background:blue;
  height: 300px;
}

#pageContent{
   display:inline-block;
   width:50%;
    background:green;
  height: 300px;
}

＆＃13;

<div id="page">
    <div id="sidebar1">
    </div>
    <div id="sidebar2">
    </div>
    <div id="pageContent">
    </div>
</div>

＆＃13;

使侧边栏\页面均匀

1 个答案: