[英]Render different in chrome and firefox
I've just finish a navbar but strangely and I don't get why, it is not rendering the same on firefox and chrome. 我刚刚完成了一个导航栏,但奇怪的是,我不明白为什么,它在Firefox和chrome上无法呈现相同的效果。
I'll show you the difference, do you have an idea where this can come from ? 我将告诉您其中的区别,您是否知道其中的来源?
As an hint (possibly), I use the propriety table
, table-row
and table-cell
but if I play with it I dont see any changement relevant. 作为提示(可能),我使用适当
table
, table-row
和table-cell
但是如果我玩的话,则看不到任何相关变化。
Here is link to the website if you want to do yourself an idea : origin And here is a link to a fiddle just with the navigator : JsFiddle 如果您想自己做一个主意,这是网站链接: origin只是导航器,这是小提琴的链接: JsFiddle
I'm still new to cross browser development so if someone has an hint for me.. ? 我仍然是跨浏览器开发的新手,所以如果有人对我有提示。
Looks to me like a float isn't clearing properly in certain browsers due to slight pixel differences in font rendering. 在我看来,由于字体渲染中的微小像素差异,浮点数在某些浏览器中无法正确清除。
Try adding clear:both
to your navigation bar. 尝试在您的导航栏中添加
clear:both
。 This should force it to clear all floats. 这将强制其清除所有浮标。
You can chose one of these options to solve your problem. 您可以选择以下选项之一来解决问题。
Add overflow: hidden;
添加
overflow: hidden;
to the #header
. 到
#header
。
Add float:left;
添加
float:left;
to the #main-menu
进入
#main-menu
Add clear:both
to the #main-menu
在
#main-menu
添加clear:both
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.