Category Tab Layout Question
I am using Category Tabs that goes across the site horizontally.
Basically this concept where first category name is placed all the way to left, and last one is all the way to right:
|One Two Three Four Five|
Code:
#navMain ul, #navSupp ul, #navCatTabs ul {
text-align: center;
}
#navMain ul li a, #navCatTabs ul li a {
padding: 10px 31px 10px 30px;
white-space: nowrap;
}
#navCatTabs ul li:first-child a
{
padding-left:0px;
padding-right:30px;
}
#navCatTabs ul li:last-child a
{
padding-right:0px;
padding-left:30px;
}
This works all nice. But one certain browsers/devices, font is rendered slightly differently, causing tabs to go in to second line.
Is there a way I can have it on a set width for each section that no matter how different the font is rendered, it stays in one row?
Thanks in advance.
Re: Category Tab Layout Question
No idea. A link to the site and a description of what browsers the issue is happening in would help us help you.
Re: Category Tab Layout Question
Re: Category Tab Layout Question
It's always a good idea to let us know up front when you're talking about issues in mobile browsers. Many of us don't own iPads or iPhones.
I'm seeing the problem in IE8, and can fix it by removing the padding from #navCatTabsWrapper.