bartender icon indicating copy to clipboard operation
bartender copied to clipboard

Tab bar with two or five items, not the full display width is used

Open ti-dev opened this issue 14 years ago • 2 comments

First, a really cool extension! I like it very much and I will use it in my project!

On your demo webpage and on my iPhone webapp I have a tab bar with five items. The problem its, that on the right-hand side, there are a few pixels free space.

I checked the CSS and I see this line: .ui-grid-d .ui-block-a, .ui-grid-d .ui-block-b, .ui-grid-d .ui-block-c, .ui-grid-d .ui-block-d, .ui-grid-d .ui-block-e { width: 19.9%; }

Why isn't there 20.0%? With 20 it works and the whole width of the screen is used.

Also you have some lines twice in your CSS: /* fix for JQM issue 2270, IE navbar breaking (will hopefully be worked into JQM / / grid a: 50/50 / .ui-grid-a .ui-block-a, .ui-grid-a .ui-block-b { width: 49.9%; } .ui-grid-a .ui-block-a { clear: left; } / grid d: 20/20/20/20/20 */ .ui-grid-d .ui-block-a, .ui-grid-d .ui-block-b, .ui-grid-d .ui-block-c, .ui-grid-d .ui-block-d, .ui-grid-d .ui-block-e { width: 19.9%; } .ui-grid-d .ui-block-a { clear: left; }

Best Regards.

ti-dev avatar Sep 13 '11 14:09 ti-dev

Thanks!

There is an issue filed with JQM regarding the navbar breaking in Internet Explorer. See here issue 2270. To avoid this I needed to reduce the width from 20% to 19.9%.

I think the problem is only 1px, so I will either try to loose it somewhere or maybe try to center the whole navbar so the free space is at least spread evenly. Give me a few days.

frequent avatar Sep 13 '11 16:09 frequent

Yes, always the IE :-) I use it for WebKit bases browsers, so I can switch without problems to 20.0%.

ti-dev avatar Sep 14 '11 09:09 ti-dev