创建三行布局

我目前正在创建三行布局的过程中，目前为止没有太多困难。问题出现了，因为我需要每行都是100％宽度来填充任何分辨率的颜色，而且我还需要每行内部的div为1024/960像素并居中。创建三行布局

东西沿着这些路线：

<div class="top"> <!--This needs to be 100%--> 
    <div class="logo-holder"></div> <!--This needs to be 1024px centered--> 
    <div class="menu-holder"></div> <!--This needs to be 1024px centered--> 
</div> 
<div class="main"> <!--This needs to be 100%--> 
    <div class="rotating-banner"></div> <!--This needs to be 1024px centered--> 
    <div class="promo-holder"> <!--This needs to be 1024px centered--> 
     <div class="promo-banner"></div> 
     <div class="games-list"></div> 
    </div> 
</div> 
<div class="footer"> <!--This needs to be 100%--> 
    <div class="footer-holder"></div> <!--This needs to be 1024px centered--> 
</div>

TNKS提前，托尼奥

来源

2010-09-28 Tonio

.top, .main, .footer { 
    width: 100%; 
    text-align: center; 
} 
.logo-holder, .menu-holder, .rotating-banner, .promo-holder, .footer-holder { 
    width: 1024px; 
    margin: 0 auto; 
    text-align: left; 
}

应该这样做。

来源

2010-09-28 11:15:14

Tnks很多，试图：“margin-left：auto; margin-right：auto;”显然没有工作。 – Tonio 2010-09-28 12:06:20

默认情况下，div将占用100％的宽度，因为它们是块级元素。

对于顶部，主要，页脚的类添加margin:0px auto;为这些divs，添加您的宽度。

这可能不是在IE中心，因此也增加text-align:center;，然后在内部的div添加text-align:left;

来源

2010-09-28 11:15:31 jimplode

.top { width:100%; margin:0 auto; } 
.logo-holder, .menu-holder {width:1024px; margin:0 auto }

但是，你应该使用人&等独特的包装元素的ID。

来源

2010-09-28 11:16:44 skazhy

创建三行布局

回答

相关问题