Need horizontal scroll in table (no vertical)

[XR8TDN9GGA]

Hello
I need a horizontal scroll in a table (no vertical). Help!!!
Heres my code:


<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div style="width: 300px; height: 100px; overflow: auto; border: 0; background-color: #FFFFFF;">
BLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAHBLAH
</div>

CHeers!!!!

[krak_d]

Hi,

change

overflow: auto;

to, overflow-x: scroll; overflow-y: hidden;

krak_d

[stuboller]

Ok so I've got the following code:

<div style="width: 500px; height: 80px; overflow-x: auto; overflow-y: hidden;; background-color: #ffffc6">
<img src="photos/skorea_photos/07440009_thumb.png">
<img src="photos/skorea_photos/07440017_thumb.png">
<img src="photos/skorea_photos/07440037_thumb.png">
/div>
and the scroll bar still doesn't go horizontally when I add lots of images.

Is this someting to do with the images or am I missing something?

Thanks
in advance

[krak_d]

Hi,
alter the code in bold to read,

overflow-x: scroll; overflow-y: hidden;

Originally Posted by stuboller

<div style="width: 500px; height: 80px; overflow-x: auto; overflow-y: hidden;; background-color: #ffffc6">

Also, you will need to align your images or they will stack one on top of the other!


krak_d

[amitmathur]

Hi,

I also faced the similar problem. I tried the solution you suggested. It works fine with IE, but "overflow-x: scroll; overflow-y: hidden;" are not supported in Mozilla and Opera.

Is there any way around with this problem.

Regards,
Amit

[beeper]

It appears browsers such as firefox and opera et al do not correctly understand overflow x & y so you have to use auto. Then for IE you can add the x and y by using the *html hack as seen below (a bit late but there you go) This makes blue scrollers and a light blue background but its easy to change.

IN YOUR CSS

.scroll{
	height:100px;
	overflow:auto;
	margin:0; padding:5px; border:0;
	scrollbar-face-color: #6095C1;
	scrollbar-highlight-color: #C2D7E7;
	scrollbar-3dlight-color: #85AECF;
	scrollbar-darkshadow-color: #427AA8;
	scrollbar-shadow-color: #315B7D;
	scrollbar-arrow-color: #FFFFFF;
	scrollbar-track-color: #4DECF8S;
	text-align:justify;
	background-color: #E1F2FB;
}
* html .scroll{
	overflow-y: scroll; 
	overflow-x: hidden;
}

IN THE HTML

<div class="scroll">
   <p>Ullamco laboris nisi in reprehenderit in voluptate ut enim ad minim veniam. Velit esse cillum dolore qui officia deserunt consectetur adipisicing elit. Quis nostrud exercitation ut aliquip ex ea commodo consequat. Cupidatat non proident, mollit anim id est laborum. Lorem ipsum dolor sit amet, velit esse cillum dolore ut labore et dolore magna aliqua.</p>
<p>Ut aliquip ex ea commodo consequat. Qui officia deserunt quis nostrud exercitation sunt in culpa. Ut enim ad minim veniam, duis aute irure dolor quis nostrud exercitation.</p>
  </div>

[nmsmajeeth]

Thanx
I tried a lot
ur code helps me to attach scrollbar in a table...
Thanx