我正在使用jquery内联验证插件:
http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/
在这里:
http://bybyweb.com/mealbook/user/add
如果您在较低的屏幕分辨率(小于1680x1050)下测试此页面(单击底部的上载),您将注意到奇怪的向左滚动(默认情况下为滚动顶部,正常行为)。。。我以前用过这个插件,我从来没有遇到过类似的问题。。。
我的html/css结构可能有问题。如果你知道会是什么-请帮忙。谢谢!
最佳答案
如果去掉body{overflow-x: hidden;}
可以在较小的窗口大小处看到页面右侧有额外的空间。这个额外的空间是由于设置的宽度大于#header
中的容器。
在#header
中,将#logo_main_menu
的宽度设置为940px
。这意味着所有子元素需要加起来达到940px。
在这个div中,设置272px
的宽度。它们加起来总共是#logo
而不是705px
!
为了使#search
内部的情况更糟,您将977px
的宽度设置为940px
,这意味着您现在正试图将#search
放入已设置为#menu
的空间中。
我确信940px
中还有其他元素也有固定的宽度。
总而言之,您需要确保如果使用固定的像素宽度,那么它们的总宽度等于父容器的宽度,在本例中是940px
p.s.我测试了去掉这些宽度,滚动条似乎工作得很好。没有横向运动。在更小的宽度,它开始看起来有点奇怪了。要进行全面测试,需要确保940 + 272 = 1212px
已关闭,并且所有宽度都已添加到容器中。