Hide Scrollbars in Overflow Auto

[vunet.us]

How can I hide scrollbars which appear in my floating div element with
CSS property overflow:auto?
I do need to use auto overflow.
Thank you.

 

[Walton]

I do need to use auto overflow.

How come you need use it?

 

[vunet.us]

How come you need use it?

https://bugzilla.mozilla.org/show_bug.cgi?id=167801

 

[Walton]

https://bugzilla.mozilla.org/show_bug.cgi?id=167801

I'm not aware of any way to hide scroll bars once you've told the
browser to turn them on. It seems to me that scroll bars are more of
a component of the operating system which means as a html/css/
javascript developer, you really don't have much control over them.

one hack:

have you tried wrapping the floating div in a slightly smaller div
that cuts off the portions where the scrollbars are?

<div id="wrapper" style="width: 183px; height: 183px; overflow:
hidden; border: solid black 1px">
<div id="floating-div" style="width: 200px; height:200px; overflow:
auto">
floating div content...
</div>
</div>

I'm not sure if that works with the bug though.

 

[vunet.us]

I'm not aware of any way to hide scroll bars once you've told the
browser to turn them on. It seems to me that scroll bars are more of
a component of the operating system which means as a html/css/
javascript developer, you really don't have much control over them.

one hack:

have you tried wrapping the floating div in a slightly smaller div
that cuts off the portions where the scrollbars are?

<div id="wrapper" style="width: 183px; height: 183px; overflow:
hidden; border: solid black 1px">
<div id="floating-div" style="width: 200px; height:200px; overflow:
auto">
floating div content...
</div>
</div>

I'm not sure if that works with the bug though.

thank you. i'll try your solution. possibly, i'll create a JS function
to justify div's height to avoid appearing of scrollbars.

 

[OmegaJunior]

How can I hide scrollbars which appear in my floating div element with
CSS property overflow:auto?
I do need to use auto overflow.
Thank you.

Did you try wrapping it up in another floated div? One of the methods I've
used was to have an outer div with overflow:auto and an inner div with
overflow:visible. Then set the inner div to width:99% and padding:0 and
margin:0.

Reason for not using javascript in this case: what happens if a user's
browser has javascript turned off by default (*cough*Microfost Internet
Exploder 7*cough*)?