html - CSS 样式 - 页面右侧在宽屏幕上溢出到右侧

Question

我有一个 HTML 页面。在我的 15 英寸笔记本电脑屏幕上，它看起来还不错。但是屏幕更宽的人报告说，屏幕右侧的文字向右侧溢出。

如果我放置视图源 HTML，它会很长。所以我将链接发布到页面。请不要认为这是我在为网站做广告（如果有人抱怨，我会用 html 替换链接）。

我怀疑我需要在某个 div 中包装一些东西，但不确定。我正在用萤火虫查看它，似乎问题发生在谷歌广告之后，但我不确定。

非常感谢有关如何解决正确泄漏的建议。该网站是problemio.com

谢谢，亚历克斯

score 1 · Accepted Answer

您需要在容器 div 上设置宽度或最大宽度。

对于您的站点，您有一个没有 ID 或与之关联的类的 div（位于横幅上方的那个）。尝试在那个 div 上设置一个width: 1200pxor max-width: 1200px（或者你想要的任何大小）

如果您希望您的网站居中，还可以margin: 0 auto;在您设置宽度限制的元素上添加一个。

这是您网站的当前结构：

<body>
  <div class="wrapper">  <-- make this your wrapper
    <div class="banner" .....></div>
    <div id="body_container"> .....

对于您的 CSS：

.wrapper { 
width: 1200px;
margin: 0 auto;
}

score 1 · Accepted Answer

1

给你<body/>一个width或max-width：

body {
    max-width: 800px;
}

于 2013-03-22T18:18:53.187 回答

score 1 · Accepted Answer

给你的网站一个这样的包装器：

<body>
<div class="wrapper">

......... REST OF SITE HERE ..........

</div>
</body>

在包装器上定义以下内容：

.wrapper {
width: 100%;
max-width: 1140px; /* you cna change this to whatever px width you want */
margin: 0 auto; /* center */
}

这将使您的站点居中，在 PX 中给它一个最大宽度，并让它尽可能地拉伸，直到达到该限制。

3 回答 3