Click here to get back home

vertical scrollbar showing when contents do not exceed bounds

 HomeNewsGroups | Search | About
 comp.infosystems.www.authoring.html    Post an article   get this group's latest topics as an RSS feed add this group's latest topics to your My MSN content add this group's latest topics to your My Yahoo content
Subject Author Date
vertical scrollbar showing when contents do not exceed bounds Rob T. 05-18-2005
Posted by Rob T. on May 18, 2005, 4:55 pm
Please log in for more thread options


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


Posted by RobG on May 19, 2005, 7:42 am
Please log in for more thread options


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


Posted by Rob T. on May 19, 2005, 11:49 am
Please log in for more thread options



>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

Posted by DU on May 30, 2005, 5:19 am
Please log in for more thread options


Rob T. 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 :)

Posted by David Ross on May 19, 2005, 12:31 pm
Please log in for more thread options


"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/>.

Similar ThreadsPosted
Vertical alignment of table cell contents in FireFox August 27, 2006, 5:55 am
Fixing a Table of Contents Menu, when contents Scroll May 5, 2008, 7:40 am
frame and scrollbar July 1, 2006, 5:55 am
Table autoadjustment in the vertical March 6, 2006, 3:43 pm
negative vertical position? December 20, 2006, 3:09 pm
scrollbar won't add to popup window July 22, 2004, 1:57 pm
DIV Scrollbar problem in FireFox... May 23, 2005, 7:01 am
100% width element causes scrollbar in IE when dir=rtl December 14, 2007, 5:21 pm
Vertical and Horizontal Frames that Scroll Together October 7, 2004, 5:35 pm
DIV text vertical-align solution January 23, 2005, 10:21 pm

Our other projects:

Art Dolls, Fairies and Mermaids - Sunnyfaces.net

Roy's Linux, Programming and Search Engines messages

1-Script XML SitemapXML Sitemap