Width of a div not limited to it's container width

  • Thread starter Thread starter Claude Schneegans
  • Start date Start date
C

Claude Schneegans

Hi,

I'm trying to have an horizontal scrolling DIV having a width which is
the rest available in a 2 columns table
in which the first is of unknown width.

See http://www.contentbox.com/claude/test/test.htm

It works fine under Mozilla, but MSIE 6 refuses to size the DIV correctly.
Any idea for a workaround?
If I set the width of the div to any numeric value, I get this width for
the div,
but what I want is width=100% of the width available in the containing TD.
width=100% works well under Mozilla, but IE undestands 100% of the
document,
not the cell in the table.

Here is the code:
<TABLE WIDTH="600" BORDER="1" CELLSPACING="1" CELLPADDING="0" BORDER="1">
<TR>
<TD VALIGN="top">
Select area of unknown width
</TD>
<TD WIDTH="100%" VALIGN="top">
<DIV STYLE="overflow-x: scroll;">
<TABLE><TR>
<TD><TEXTAREA COLS="40" ROWS="" STYLE="float:left">this
is the rest of the content which we want to scroll if it is latger than
the space left by the Select area at left.</TEXTAREA></TD>
<TD><TEXTAREA COLS="40" STYLE="float:right">this is the
rest of the content which we want to scroll if it is latger than the
space left by the Select area at left.</TEXTAREA></TD>
<TD><TEXTAREA COLS="40" STYLE="float:right">this is the
rest of the content which we want to scroll if it is latger than the
space left by the Select area at left.</TEXTAREA></TD>
</TR></TABLE></DIV>
</TD>
</TR>
</TABLE>
 
Hi Claude,

I don't know what you are trying to do.... Stock or News ticker? Usually for
such applications you use an iframe with an embeded page that holds the div.
The iframe will size to 100% of the containing td.

Regards.
 
I don't know what you are trying to do.... Stock or News ticker?

Much simpler than this. I have a form in a table which is supposed to
have a width of 600.
In this space there are two elements, the one left has a widh unknow
since it depends on the
items in the select area.
All I want is the element at the right to occupy the rest of the space
available.
If you look at the example in my message, you'll see that under FireFox,
the table is indeed
600 wide and its content scrolls. With IE, the table is as large as
possible, and the inside does not scroll.
This is definitely a bug, I was just looking for some workaround.y
Il finally found it with some Javascript which resizes correctly the table :

var scrollDiv = document.getElementById("scrollDiv");
if(scrollDiv)scrollDiv.style.width =
600-document.getElementById("idLeft").offsetWidth + "px";
 
Back
Top