CSS居中网页问题

我有麻烦了使用的CSS定心我的网页：CSS居中网页问题

下面

CSS代码：

#wrapper { 
    margin-left:auto; 
    margin-right:auto; 
    width: 100px; 
} 

#welcome { 
    position:absolute; 
    top:202px; 
    width:560px; 
    height:224px; 
    z-index:2; 
} 
#newsSection { 
    position:absolute; 
    left:576px; 
    top:209px; 
    width:380px; 
    height:600px; 
    z-index:2; 
}

HTML：

<body> 
<div id="wrapper"> 
<div id="welcome"> 
    //content here 
</div> 
<div id="newsSection"> 
    //content here 
</div> 
</div> 
</body>

我中心的网页，除了#newsSection div。

为什么我在#newsSection div下放置“left：576px”的原因是因为我希望它将它放在#welcome div的旁边（并排）然而，当我缩小浏览器大小时，#newsSection div将向左移动一点，并重叠＃欢迎div。
如果我删除“left：57px”，那么#newsSection div将出现在#welcome div之上...

请帮忙。谢谢

来源

2011-02-13 Victorgalaxy

这可能是因为你使用绝对位置的子div。因此，“孩子们会狂奔”，因为他们并不在乎父母div＃wrapper是中心的。

一些潜在代码：


#wrapper { 
    margin-left:auto; 
    margin-right:auto; 
    width: 100px; 
} 

#welcome { 
    float: left; 
    width:560px; 
    height:224px; 
} 
#newsSection { 
    float: left; 
    width:380px; 
    height:600px; 
}

来源

2011-02-13 08:38:03 jerluc

好吧，我删除aboslute位置。现在，一切都在中心，不错，但是#newsSection div出现在BELOW＃欢迎div。我希望它出现在它旁边。我该怎么做？ – Victorgalaxy 2011-02-13 08:45:55

只是增加了一些潜在的代码（不完全确定你希望如何显示，但这是我的最佳猜测。 – jerluc 2011-02-13 08:48:09

-1

你应该使用相对定位，即tagname.class {位置：相对;右上：？ ;}

来源

2011-02-13 08:52:26 all

-2

要居中的网页，你可以使用这个：

.container{ 
 
    width: 100%; 
 
    max-width:80%; 
 
    margin: 0 auto; 
 
}

来源

2017-04-24 08:36:52 user2228874

CSS居中网页问题

回答

相关问题