尴尬的水平居中对齐

发布于 2024-12-18 14:34:09 字数 87 浏览 0 评论 0原文

任何人都知道如何将下一页水平居中。正如您所看到的,表格部分可以轻松居中,但如何对绝对定位的 div 组执行相同的操作。

谢谢

Anyone have any ideas how I can horizontally center the following page. As you can see the table section can be easily centered but how to do the same with the group of absolute positioned div's.

http://gideaparkbowlingclub.associateddata.co.uk/1a.htm

Thanks,

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

十二 2024-12-25 14:34:09

我将使用以下 CSS 将内容包装在

中。

.content {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

当您将某些内容绝对定位在相对定位的元素内时,绝对位置是相对于该外部元素的。因此,您的图像不应溢出您插入内容的新 div。

I would wrap the content inside a <div class="content"> with the following CSS

.content {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

When you absolutely position something inside an element that is relatively positioned the absolute position is relative to that outer element. So your images should not overflow this new div that you insert the content.

从﹋此江山别 2024-12-25 14:34:09

您需要为所有绝对定位的 DIVS 制作一个包装器,并将其设置为 position:relative。这样 DIV 就可以在包装器中找到它们的起源。然后你只需将包装 DIV 居中即可。

.wrapper {
   width:805px;
   margin-left:auto;
   margin-right:auto;
   position:relative
}

PS 对所有内容使用绝对定位是一个坏主意。了解如何使用浮动。

You need to make a wrapper for all of your absolutely-positioned DIVS, and set it as position:relative. That way the DIVs find their origin in the wrapper. Then you just have to center the wrapper DIV.

.wrapper {
   width:805px;
   margin-left:auto;
   margin-right:auto;
   position:relative
}

P.S. using absolute positioning for everything is a bad idea. Learn how to use floats.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文