- This topic is empty.
Viewing 9 posts - 1 through 9 (of 9 total)
Viewing 9 posts - 1 through 9 (of 9 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
This has bugged me for a while now, and there doesn’t seem to be a satisfactory solution.
Basically I have a navigation bar and there are various elements within it, all with variable widths. Ok, In Firefox some of the li > anchor elements are showing 1px less in width then there Webkit counterpart. The result of this is that the navigation bar doesn’t fit the width of the size perfectly in Mozilla.
What is the solution? I prefer to not use specific widths if I can help it, although I fear that will eventually be the dirty solution.
If I can avoid that it would be preferable.
What I have discovered is for one of the elements which are showing as 50px wide in Webkit, they are showing as 49.4333px in Mozilla.
Hmm, not really sure this is the solution.
I am using fonts.com and specifically this font – ITC Franklin Gothic Compressed Book.
Does your license specify you can embed that font onto your site?
“I am using fonts.com”
Thank you for making that bold to clarify.
Well didn’t really see what your comment had to do with the issue.
Right, so if I may try to help, your problem is basically that you want to fix an issue which Mozilla is rendering a half of a pixel differently than Webkit browsers?
Pretty much. It seems the box model for Mozilla is flawed. For now I have decided to give each nav element a fixed pixel width. Which will only work as long as the navigation items remain set. An idea that was bandied around was using Javascript to calculate the width of the bar, and assign values to all the elements.
Mind you even if I manage to solve this box model issue then that wouldn’t prevent the elements from breaking should the editor decide to amend the navigation.