Posted by pbx on 01/06/07 20:56

BootNic wrote:
> > pbx <pbeisel@gmail.com> wrote:
> > news: 1168111898.950706.47910@51g2000cwl.googlegroups.com
> >> BootNic wrote:
> >>> pbx <pbeisel@gmail.com> wrote:
> >>> news: 1168104852.331713.245540@51g2000cwl.googlegroups.com
> >>> i have a div tag on my html page as follows:
> >>>
> >>> <div style="overflow-x:scroll;"> (or auto, makes no difference)
> >>>
> >>> the contents of the div are about 1500 pixels wide.
> >>>
> [snip]
> >>>
> >>> any workaround?
> >>
> >> style="width:100%;overflow:scroll;overflow-y:visible;overflow-x:scroll;"
> > tried:
> >
> > style="width:100%;overflow:scroll;overflow-y:visible;overflow-x:scroll;"
> >
> > unfortunately it doesn't change anything obvious.
> >
> > does it matter than the contents of the div is a table?
>
> Folks around these parts get a might testy when you top post. Most
> of them are bottom feeders ;-)
>
> It would be in your best interest to make an example and provide a
> URL. It's not likely I can guess the content that may be causing the issue
> you describe.
>
> --
> BootNic Saturday, January 06, 2007 3:06 PM
>
> Humor is just another defense against the universe.
> *Mel Brooks*

(sorry for that top post, i don't do this often. i fear i am about to
make mistake #2 by putting my sample code here vs. a remote server...)

ok, here is some simple HTML that demonstates the problem. copy and
paste into a text file and then open with IE 7 and then Firefox.

the first div, byitself, scrolls as desired.

the second div, enclosed in a simple table, doesn't scroll.

the div contents and style attributes are identical, the second one is
simply enclosed in a table.


<div
style="background-color:WhiteSmoke;width:100%;overflow:scroll;overflow-y:visible;overflow-x:scroll;">
<table>
<tr>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
</tr>
</table>
</div>



<br><br>


<table>
<tr>
<td>

<div
style="background-color:WhiteSmoke;width:100%;overflow:scroll;overflow-y:visible;overflow-x:scroll;">
<table>
<tr>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
<td>
<img
src="http://images.apple.com/ipod/images/capbottomitunescomp20060912.png ">
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

[Back to original message]