vertical scrollbar showing when contents do not exceed bounds

[Rob T.]

I am using a div tag to make an element that contains some text. I
have specified overflow: auto; in my stylesheet. If I use
font-size/line-height to specify the font information I get a vertical
scrollbar in firefox/netscape (not IE) , even though the text I have
in the element does not exceed the bounds. The simple example below
casues this behaviour. How do I fix this?

<div style="overflow:auto; height:100px; width:100px; border:1px
#000000 solid; font:10px/10px Times;">
overflow set to auto.
overflow set to auto.
</div>

The text clearly is within the box, and yet the scrollbar is there.
Any help appreciated.

Rob

[RobG]

Rob T. wrote:

I am using a div tag to make an element that contains some text. I
have specified overflow: auto; in my stylesheet. If I use
font-size/line-height to specify the font information I get a vertical
scrollbar in firefox/netscape (not IE) , even though the text I have
in the element does not exceed the bounds. The simple example below
casues this behaviour. How do I fix this?

<div style="overflow:auto; height:100px; width:100px; border:1px
#000000 solid; font:10px/10px Times;">
overflow set to auto.
overflow set to auto.
</div>

The text clearly is within the box, and yet the scrollbar is there.
Any help appreciated.

Rob

Google (and Peter-Paul Koch!) is your friend:

<URL:http://www.quirksmode.org/bugreports/archives/2005/04/When_an_li_element_is_set_to_overflow_auto_Firefox .html>
--
Rob

[Rob T.]

On Thu, 19 May 2005 06:42:49 GMT, RobG <rg***@iinet.net.auau> wrote:

Rob T. wrote:

I am using a div tag to make an element that contains some text. I
have specified overflow: auto; in my stylesheet. If I use
font-size/line-height to specify the font information I get a vertical
scrollbar in firefox/netscape (not IE) , even though the text I have
in the element does not exceed the bounds. The simple example below
casues this behaviour. How do I fix this?

<div style="overflow:auto; height:100px; width:100px; border:1px
#000000 solid; font:10px/10px Times;">
overflow set to auto.
overflow set to auto.
</div>

The text clearly is within the box, and yet the scrollbar is there.
Any help appreciated.

Rob

Google (and Peter-Paul Koch!) is your friend:

<URL:http://www.quirksmode.org/bugreports/archives/2005/04/When_an_li_element_is_set_to_overflow_auto_Firefox .html>

Thanks for taking a look. It seems like this person is having a
different problem though. I'm seeing a vertical not horizontal
scrollbar and I'm using div tags. If the font-size is specified
without the line-height the vertical scrollbar goes away. I tried
adding the font information to p in the stylesheet instead of my text
div tag but I get the same results. IE has no problems with this.

Rob

[David Ross]

"Rob T." wrote:

I am using a div tag to make an element that contains some text. I
have specified overflow: auto; in my stylesheet. If I use
font-size/line-height to specify the font information I get a vertical
scrollbar in firefox/netscape (not IE) , even though the text I have
in the element does not exceed the bounds. The simple example below
casues this behaviour. How do I fix this?

<div style="overflow:auto; height:100px; width:100px; border:1px
#000000 solid; font:10px/10px Times;">
overflow set to auto.
overflow set to auto.
</div>

The text clearly is within the box, and yet the scrollbar is there.
Any help appreciated.

Rob

In the CSS2.1 specification, see §11.1.1 "Overflow: the 'overflow'
property":

"auto
This value indicates that the content is clipped and that if the
user agent uses a scrolling mechanism that is VISIBLE ON THE SCREEN
(such as a scroll bar or a panner), that mechanism should be
displayed for a box whether or not any of its content is clipped.
This avoids any problem with scrollbars appearing and disappearing
in a dynamic environment. When this value is specified and the
target medium is 'print', overflowing content may be printed."
[emphasis added]

Thus, the lack of a scrollbar in IE is an error. Firefox and
Netscape (both clones of Mozilla) are correct.

--

David E. Ross
<URL:http://www.rossde.com/>

I use Mozilla as my Web browser because I want a browser that
complies with Web standards. See <URL:http://www.mozilla.org/>.

[DU]

Rob T. wrote:

On Thu, 19 May 2005 06:42:49 GMT, RobG <rg***@iinet.net.auau> wrote:

Rob T. wrote:

I am using a div tag to make an element that contains some text. I
have specified overflow: auto; in my stylesheet. If I use
font-size/line-height to specify the font information I get a vertical
scrollbar in firefox/netscape (not IE) , even though the text I have
in the element does not exceed the bounds. The simple example below
casues this behaviour. How do I fix this?

<div style="overflow:auto; height:100px; width:100px; border:1px
#000000 solid; font:10px/10px Times;">
overflow set to auto.
overflow set to auto.
</div>

The text clearly is within the box, and yet the scrollbar is there.
Any help appreciated.

Rob

Google (and Peter-Paul Koch!) is your friend:

<URL:http://www.quirksmode.org/bugreports/archives/2005/04/When_an_li_element_is_set_to_overflow_auto_Firefox .html>

Thanks for taking a look. It seems like this person is having a
different problem though. I'm seeing a vertical not horizontal
scrollbar and I'm using div tags. If the font-size is specified
without the line-height the vertical scrollbar goes away.

The default value for line-height in Mozilla-based browsers is 1.2. So
your content should fit without causing an overflow into a line box 20%
longer.

My recommendation is to never play with line-height values unless you
know well what you're doing.

DU
--
The site said to use Internet Explorer 5 or better... so I switched to
Firefox 1.0.4 :)