CODEWITHSUNDEEP
jquery-ui-tabs
Jake
Jake

Reputation: 51

Jquery UI Tabs Floating Divs in tab panel

I am having trouble trying to get a jquery ui tab panel's height to grow with floating divs within the panel. the divs have specific data returning to these divs and I need them to float left and right to save ui real estate. Does anyone know how i can fix this?

Upvotes: 1

Views: 4285

Answers (1)

Joel
Joel

Reputation: 327

Actually, this is a well-known css issue. A discussion is here:

http://www.quirksmode.org/css/clearing.html

To summarize the article, any <divs> that you wish to function as both a tab pane and a float container should have these styles added to them either in your <style> or css <link> files:

overflow: auto;
width: 100%

This isn't a bug. It's intentional. The floating div literally lifts out of the container, and the container will not be aware of the floating div. At least, that was the goal.

You should do a search on here for "clearing floats" or other related css rules, because using the above will cause issues with certain browsers (in short: 'take care to test this, all the same').

Upvotes: 6

Related Questions