如果没有绝对宽度，调整页面大小不会进入滚动条

发布于 2024-12-21 22:33:32 字数 282 浏览 3 评论 0原文

所以我有以下带有导航栏的页面： http://michigangurudwara.com/pclass/ 它看起来不错，但是当您调整浏览器大小时，所有内容都会重叠。我想要的是导航栏填满整个宽度，然后当调整屏幕大小时应该弹出滚动条，但是当我在 .navbar 类中执行 width:100% 时，这种情况不会发生。获得滚动条的唯一方法是使用绝对宽度。但如果我这样做，我就无法占用不同显示器尺寸的整个屏幕宽度。我该怎么做？

原文

分享到QQ

分享到微博

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

发布评论

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

习惯那些不曾习惯的习惯 2024-12-28 22:33:32

设置最小宽度...

.navbar {
    min-width: 1000px; }

任何小于该宽度的值都会导致滚动条出现。

Set a minimum width...

.navbar {
    min-width: 1000px; }

Anything less than that will cause the scroll bar to appear.

回复收藏 0 原文

岁吢 2024-12-28 22:33:32

这当然是一种不同的导航风格，让导航栏始终具有相同的宽度可能会给许多用户带来大问题。更好的方法是将页面宽度设置为 1000px；然后在两侧设置自动调整边距。

.navbar{
    width:1000px;
    margin:auto;
}

但是，如果您决定这样做，那么您始终可以使用 Javascript 获取浏览器宽度，然后使用它来设置动态宽度变量。

我还打算建议 minimum-width:100%; 但我认为您仍然会遇到同样的问题。

问题是，当使用百分比时，模板将根据浏览器宽度重新调整大小，其中像素将始终代表您提到的绝对值。

This is certainly a different style to navigation, to have the nav bar always the same width could make large issues for many users. A better approach is to set the page width to say 1000px; and then have auto sizing margins on either side.

.navbar{
    width:1000px;
    margin:auto;
}

However if your determined to do it this way then you could always get the browser width with Javascript and then use that to set a dynamic width variable.

I was also going to suggest minimum-width:100%; but I think you'd still come across the same issue.

The problem is when using percent the template will re-size to the browser width where as pixels will always represent an absolute value as you mention.

回复收藏 0 原文

~没有更多了~