gpt4 book ai didi

css - 页面上最外层的主要 div 不会居中

转载 作者:行者123 更新时间:2023-11-28 04:40:10 30 4
gpt4 key购买 nike

我读了this并写下这段代码:

  .wholePageDivForCentering
{
width: 80%;
white-space: nowrap;
display:inline-block;
margin: 0 auto;
border: 4px solid red;

/* other stuff I tried........*/
/*padding-left: 10%;*/
/*margin-left: 10%;*/
/*padding-right: 10%;*/
/*margin-right: 10%;*/

}



<body>
<div class="wholePageDivForCentering">
<h2>Hello from the page</h2>
<!-- stuff such as 2 nested divs contained text labels, and a small image -->
</div>
</body>

出于某种原因,我在最外层的 div 周围放置了一个纯红色的 4 像素边框。

我想看看最外层 div 周围的粗红色边框矩形是否会在页面上水平居中

它没有。
编辑:当浏览器最大化时,我最外层的 div 保持在左侧。

你可以看到我尝试了不止一件事。在我看来,我应该能够:

  • 告诉这个最外层的 div,红色粗边框的,占据 80%浏览器窗口

  • 然后使用上述 SO 帖子中的建议(同样,here)——得到这个最外层的 div 总是占据浏览器窗口的 80%,但水平居中在浏览器窗口上。

我个人?我认为我的 margin-left = 10%,margin-right=10% 应该可以,但不行。

要查看我想要的内容——打开 Craigslist,地址为 http://sfbay.craigslist.org/并最大化浏览器窗口(CL 站点的主页,而非嵌套页面)。

Craiglist 主页面两侧空白的水平宽度当您最大化浏览器时,页面是相同的。主页的列是水平居中。

因为(可能)那个页面有一个居中的 div 包围着所有东西其他在主页上。

我该怎么做?

最佳答案

取出 display:inline-block 它应该可以工作。

这是一个 Jsfiddle(点击运行):http://jsfiddle.net/zKm6b/

我还建议为该 div 使用 id 而不是 class。希望对您有所帮助!

关于css - 页面上最外层的主要 div 不会居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9510838/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com