菜单和图像上的一些调整大小问题

Question

在过去的几天里，我一直在思考和在网站上工作。当调整大小时，我发现该网站没有做到这么好。我认为该网站应该从1024到768之间看起来不错。

所以，当下面的页面大小调整到最小尺寸时，您会看到顶部菜单将被压扁在一起。尽管所有菜单项都有足够的空间。而且我希望图像适当调整到窗口大小。

这里是链接 http://bit.ly/NpE9cF

会有人请帮助我给我一些实用的建议？ 我应该使用类似jquery的方式来调整大小吗？或者我可以解决这些问题在CSS？

非常感谢。

Answer 1

在style.css中，对于ul#primary li a {}，您有一些固定的宽度。

将此宽度更改为%值。并且还要添加一些min-width，这样在调整大小后，宽度不会进一步减小。

变化

ul#primary li a { 
    display: block; 
    float: left; 
    margin: 0; 
    padding: 20px 20px 11px; 
    width: 192px; 
} 

到

ul#primary li a { 
    display: block; 
    float: left; 
    margin: 0; 
    min-width: 100px; 
    padding: 20px 20px 11px; 
    width: 20%; 
} 

中的style.css文件。