The best I could do for the time being is use javascript to set the
padding on the 'ul' element
I then bind to load and resize events
Ideally I would use css but I have hit a dead end on using css to
center the tabs
Below is the js:
$(document).ready(function() {
//If the User resizes the window, adjust the #container
height
$(window).bind('resize', setTabsPadding);
//on load call the setTabsPadding function
$(window).bind('load', setTabsPadding);
//Adjusts the left padding depending on the width of the
body
//currently the function centers the tabs
function setTabsPadding(e) {
var liExtra = 4;
var bodyWidth = $('body').width();
// console.log('bodyWidth is: ' + bodyWidth);
var liWidth = 0;
$('#tabs ul li').each(function(n) {
// var idth = $(this).width();
// console.log('width is: ' + idth);
liWidth += Math.ceil($(this).width()) + liExtra;
});
// console.log('width is: ' + liWidth);
var padLeft = (bodyWidth - liWidth) / 2;
$('#tabs ul').css('padding-left', padLeft);
}
});
On Apr 15, 11:18 am, Klaus Hartl <klaus.ha...@googlemail.com> wrote:
> On 15 Apr., 04:16, James <james.gp....@gmail.com> wrote:
>
> > I'd be interested if anyone did find a possible way.
>
> > As far as I know, this is a limitation of CSS especially having
> > content with dynamic widths and it can't be done.
> > This is one of the places where people says tables have some
> > advantages over div's. :p
>
> You could set display to table/table-cell, I've did that in the past
> to center elements with unknown width. That would still require more
> hackery in IE.
>
> --Klaus
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to jquery-ui@googlegroups.com
To unsubscribe from this group, send email to
jquery-ui+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
