CODEWITHSUNDEEP
jquerycssjquery-uitabs
Deep Frozen
Deep Frozen

Reputation: 2075

Div not wrapping around whole page in width

I use jQuery UI tabs as my container div. Now I need to show ALOT of data in a table, which will almost always be wider than the container itself. Unfortunately, I can't get the container to wrap.

See this fiddle

I have tried positions, overflow: auto, but nothing seems to work like I want it to. overflow: auto puts the horizontal scrollbar in the tabs itself, but I want it on the body. Anybody have an idea on how to do this?

Long story short: I need the #main-div to wrap around all it's div childs, without a scrollbar in the tabs. I simply wanna wrap my content so the out div is dynamic with the content

Upvotes: 4

Views: 183

Answers (5)

Sem
Sem

Reputation: 4669

Is this what you mean? All I did was this and removed the relative position. 

#main-tabs
{
   float:left;
   min-width:100%;
}

Upvotes: 5

Sparky
Sparky

Reputation: 4879

#test {
    overflow: scroll;
}

Upvotes: 0

Simon Dragsbæk
Simon Dragsbæk

Reputation: 2399

Jsfiddle

i added overflow:scroll;

anyhow here you get a scroll on both axis so you might look in to overflow scroll on x and y Checkout the property here (be aware that its a css 3 property) dont know which browsers support it.

Upvotes: 1

Tosh
Tosh

Reputation: 1857

#main-tabs div
{
   position: relative;
   overflow: auto;
}

Upvotes: 1

Ahsan Khurshid
Ahsan Khurshid

Reputation: 9467

Add #test { overflow: auto; }

SEE DEMO

Upvotes: 1

Related Questions