当浏览器调整大小时弄乱网站布局

正如标题所示，我在创建我的网站时遇到了问题。它目前处于设计阶段，我在将浏览器置于窗口模式时遇到问题。当浏览器调整大小时弄乱网站布局

一切都重新排列它自我。如果您滚动一下，您会看到一些部分失灵。

我不知道我做错了什么，但我非常想解决这个问题。

这是链接到我的网站，因为它代表： http://www.dennis-website.co.nf/index.html

2013-07-29 Denni199

我认为你的问题是你的Twitter盒子漂浮得很好，所以当你做到这一点时小的菜单项会保留在页面右侧，而您的twitter框悬挂在边上，所以当您向右滚动时，菜单项会保留在原来的位置？ – FrostbiteXIII

无关：您的列表中有无效的HTML。 '

'应该是'

' –

@WesleyMurch我不知道那会是无效的。我这样做是为了在悬停时更改列表对象的背景和链接的颜色。 – Denni199

有设置到整个网站没有最小宽度。您的#container_main的宽度设置为1002px，因为网站的其余部分不会使标题和菜单折叠到浏览器的宽度。你可以通过设置快速解决这个问题

#wrapper { 
    min-width: 1002px; 
}

所以整个网站有一个最小宽度。

2013-07-29 12:57:42 jerrylow

感谢其他答案，但这是为我制定的一个答案。 – Denni199

您需要使用Media queries调整字体大小，元素的宽度和更多的不同的屏幕分辨率。

2013-07-29 12:51:44

对不起，我不觉得我很明白？你可以给我一个例子，或者更深入一点？ – Denni199

媒体查询是CSS属性，您可以根据屏幕分辨率或设备类型等更改页面中元素的属性。要在现实中看到这个http://css-tricks.com/，请访问此网站并调整您的浏览器。 –

哦，现在我明白了。这很酷，但它并不是真正的我想要的。 @ jerrylow建议什么，使它成为我想要的。无论如何，我会记住Media Queries的想法。 – Denni199

<div id="nav">

你的CSS必须是：

#nav 

{ 
width:100% 
}

2013-07-29 13:01:14

谢谢。我已经添加了这个。 – Denni199

你必须做出响应式设计的网站，以解决这个问题。这是一本关于Responsive Design by Ethan Marcotte的好书。它将涵盖如何制作响应式网格，响应式图像和媒体查询的所有主题+这仅仅是150页小型免费pdf：D

2013-07-29 13:07:05

回答