DataTable float issue

JQ_Noob

Hi,

I have a very simple two column layout where I am placing a DataTable into the right-most column. The problem I am having is that when I am using bJQueryUI, the table is being positioned below the contents of the first column instead of next to them. I have tried:
[code].dataTables_wrapper {
clear: none;
}[/code]
However, this moves the top of the table (search box/etc) into the correct spot but the rows remain at the bottom. I have also tried:
[code].dataTables_scroll {
clear: none;
}[/code]

Any ideas on what the problem is?

This can be reproduced easily:
[code]
#col1 {
float: left;
width: 400; }

#col2 {
margin-left: 400px; }

----

SOMETEXTSOMETEXTSOMETEXTSOMETEXTSOMETEXTSOMETEXTSOMETEXTSOMETEXT



//insert table in this div


[/code]

Thanks.

GregP

I'm only effective at helping with this kind of stuff when I can see a live link. The part of my brain that abstracts things isn't as strong as the part that likes hands-on examples. ;-)

That said, I could not reproduce your issue when I followed this formula:

col1 float left,
col2 NO FLOAT at all. Neither left nor right
table clear none

If you float col2, you will have wrapping issues.

Even if I'm missing something, as long as the table isn't doing any "clearing", it's still probably down to wrapping. Table widths are guidelines at best and they WILL expand beyond what you think you've told it. The only way to contain it width-wise is to either wrap it in a div with an overflow property set, or to style it with table-layout: fixed (which will still cause text artifacts if your table can't fit your space).

Kinda rambled there. Bottom line: it is either clearing a float (which you seem to be taking steps to resolve) or it's being forced to wrap (usually due to floating).

JQ_Noob

Yes I had sort of followed that line of thinking as well, but I'm not sure what the problem is. Earlier I was able to get it working without bJQueryUI set, so I suspect there might be something there which is why I decided to ask here.

There is no float on col2. The width doesn't appear to be the problem either because I've tried expanding the width of my container and also had a scrollbar in place to limit the width of the DT. Is there a way to upload samples to this site?

GregP

Nerp. Most people just provide a link.