-1

我必须将 Sharepoint 2007 站点迁移到 Sharepoint 2010，并且用户拥有 IE8 浏览器。

所以，我想在跨浏览器模式下设置具有该布局的网站。

我真正的问题是我会为左列和右列设置一个渐变背景，浏览器高度为 100%，而我的中间div必须有 955px 的最小宽度。

没有TABLE标签可以吗？

我试过：

<div id="main1">
   <div id="main2">
    <div id="left">&nbsp;</div>
    <div id="right">&nbsp;</div>
    <div id="middle">
         <table width="100%" height="500"> <tr><td>aaa</td></tr></table>
    </div>
    <div class="cleaner">&nbsp;</div>
   </div>
</div>

CSS：

body,html{
     height:100%;
     min-height:100%;
     background-color:gray;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
PADDING-TOP: 0px;
}
#main1 {
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
PADDING-TOP: 0px;

MIN-WIDTH: 995px;
border-bottom:1px solid gray;

height: auto;
min-height:100%


}
#main2 {
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
BACKGROUND: url(blue.gif) repeat-y right top;
PADDING-TOP: 0px;
}
#left {
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-LEFT: 0px;
WIDTH: 20px;
PADDING-RIGHT: 0px;
background-color:blue;
FLOAT: left;
FONT-SIZE: 80%;
PADDING-TOP: 0px;
height:100%;
}
#right {
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-LEFT: 0px;
WIDTH: 20px;
PADDING-RIGHT: 0px;
background-color:blue;
FLOAT: right;
FONT-SIZE: 80%;
PADDING-TOP: 0px;
height:100%;
}
#middle {
MARGIN: 0px 20px;
BACKGROUND: red;
FONT-SIZE: 80%;
height:100%;
min-height:100%;
}
.cleaner {
HEIGHT: 1px;
CLEAR: both;
}
4

3 回答 3

0

由于标准屏幕分辨率为 1024*768，您可以分别给左右 div 和中间 div 赋予固定宽度。

于 2013-03-28T10:11:50.337 回答
0

HTML

<div id="mainContainer">

    <div id="left-column" class="column">           
    </div>

    <div id="middle-column" class="column">             
    </div>

    <div id="right-column" class="column">      
    </div>  

</div>

css

#mainContainer{
    width: 1355px;
    margin: 0px auto;
    padding: 0px;
}

.column{
    display: block;
    height: 100%;
    float: left;
}
#middle-column{
    width: 955px;

}
#left-column, #right-column{
    width: 200px;

}
于 2013-03-28T10:12:18.133 回答
-1

是的，

<aside class="sidebar left"></aside>
<div class="mainContent"></div>
<aside class="sidebar right></asdie>

剩下的就是 CSS。<aside></aside>是一个 HTML5 标记。玩得开心。

于 2013-03-28T10:05:28.180 回答