Search jQuery

jQuery Forum

dduck1934

jquery UI tabs and container height

in Using jQuery UI • 9 years ago

Is there a way to make the tab container extend to the bottom of the browser window? I have a footer at the bottom of the page and Ive used the sticky footer example here for that..http://ryanfait.com/sticky-footer/

So how can i make the tab container height extend the height of the browser minus the footer height etc..

I have seen possible javascript solutions, but i havent found one thats pure css.

Any help would be appreciated!

Replies(3)

Kevin B

Re: jquery UI tabs and container height

9 years ago

Hmmm.....

Position the tab container absolutely within a relatively positioned element and give it a top left and right of 0, and then a bottom equal to the height of the footer. I'll post a fiddle in a few min.

-- Kevin

Kevin B

Re: jquery UI tabs and container height

9 years ago

it actually isn't that simple. you have to also make the panels stretch in the same way while taking into account the height of the tabs, however it can be done. its just going to take some css modifications.

-- Kevin

dduck1934

Re: jquery UI tabs and container height

9 years ago

i ended up just modifying some of the border css so it "looks" like its extending the whole page when its only extending as far as the content in each tab. Not a huge deal. Thanks!

pclindsay

Re: jquery UI tabs and container height

9 years ago

Hi - I have a similar issue with the jQuery UI tabs and a sticky footer - could you post details on how you solved it?

Cheers, Phil

Top Reply

Response title

Attachments

jQuery Forum

jquery UI tabs and container height

Replies(3)

Re: jquery UI tabs and container height

Re: jquery UI tabs and container height

Re: jquery UI tabs and container height

Re: jquery UI tabs and container height

Statistics

Tags

Actions