css - padding issue in Firefox -
http://www.pcdconsultancy.co.uk/
im having trouble menu. appears have @ least couple of pixels bigger on firefox ie or chrome, can advise me appears be? ive tried tweak seems still out.
my menu css :
#headermenu { margin-top: 9px; margin-left: 80px;} #headermenu ul {background: #efefef; padding: 0px; margin: 0; list-style: none; display: inline-table; } #headermenu ul li { float: left; background: -moz-linear-gradient(top, #999999 0%, #3a3a3a 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999999), color-stop(100%,#3a3a3a)); /* chrome,safari4+ */ background: -webkit-linear-gradient(top, #999999 0%,#3a3a3a 100%); /* chrome10+,safari5.1+ */ background: -o-linear-gradient(top, #999999 0%,#3a3a3a 100%); /* opera 11.10+ */ background: -ms-linear-gradient(top, #999999 0%,#3a3a3a 100%); /* ie10+ */ background: linear-gradient(to bottom, #999999 0%,#3a3a3a 100%); /* w3c */ filter: progid:dximagetransform.microsoft.gradient( startcolorstr='#999999', endcolorstr='#3a3a3a',gradienttype=0 ); /* ie6-9 */ border-left: 1px solid #666666; border-right: 1px solid #000; border-top: 1px solid #999999; border-bottom: 1px solid #999999; } #headermenu ul li:hover {} #headermenu ul li {display: block; color: #fff; text-decoration: none;font: 15px arial; padding: 7px 20px; /* old browsers */}
if add line-height declaration #headermenu ul li element, should fix issue. see code below:
#headermenu ul li {line-height: 15px;}
i guarantee fix issue.
thank you!
Comments
Post a Comment