CODEWITHSUNDEEP
jqueryjquery-uijquery-layout
Don P
Don P

Reputation: 63647

jQuery UI layout on a container div instead of body

I'm using jQuery UI layout. I want to apply the layout to a container, not the entire body.

Works when I do $('body').layout();.

http://jsfiddle.net/JPEaa/216/

Fails when I add a container div and do $('.myDiv').layout();.

http://jsfiddle.net/JPEaa/217/

Am I selecting or applying my container incorrectly?

Upvotes: 4

Views: 3019

Answers (2)

Jeach
Jeach

Reputation: 9042

I also wrap my layout with a div element, such as:

<div class='wrapper'>
   // layout divs go here
</div>

Except that I found it more practical to use the following CSS instead of a fixed height (as Andy has suggested) in order to allow for my layout to properly use the entire browser window and also correctly self adjust as the window was resized.

.wrapper {
   position : absolute;
   width    : 100%;
   margin   : 0 auto;
   top      : 0px;
   bottom   : 0px;
}

Note that due to the position: absolute, this may not be viable for everyone.

Upvotes: 0

Andy
Andy

Reputation: 30135

You container needs to have an explicit size set. If you add height to your .myDiv it works:

<div class="myDiv" style="height:400px">

http://jsfiddle.net/JPEaa/223/

Upvotes: 8

Related Questions