Vertical scrollbar is not hidden when an absolute div with scrolling is hidden

RESOLVED DUPLICATE of bug 187435

Status

()

Firefox
General
RESOLVED DUPLICATE of bug 187435
13 years ago
13 years ago

People

(Reporter: AJ Brindley, Assigned: Blake Ross)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

13 years ago
User-Agent:       Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2
Build Identifier: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2

I have a DIV that is absolutely positioned with content overflow set to auto.
The content runs off the bottom of the div, and it correctly displays the
vertical scrollbar. If I then hide the layer via javascript, the layers hide,
but the vertical scrollbar remains.

If I load the page with the layers already hidden, the rogue vertical scrollbar
is visible.

Reproducible: Always

Steps to Reproduce:
Past the following text into a document, save and drop onto Firefox.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<meta name="generator" content="Adobe GoLive">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#layer1  { visibility: hidden; position: absolute; top: 18px; left: 18px; width:
370px; height: 100px; overflow: auto }
--></style>
	</head>

	<body bgcolor="#ffffff">
		<div id="layer1">
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.</div>
		<p></p>
	</body>

</html>
Actual Results:  
Vertical scrollbar should be hidden with the layer, but is visible even though
the layer is not.

Expected Results:  
Vertical scrollbar should be hidden with the layer.

Renders correctly in Firefox for windows, Safari etc.
(Reporter)

Comment 1

13 years ago
There is a clumsy workaround. See following code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<meta name="generator" content="Adobe GoLive">
		<title>Untitled Page</title>
		<style type="text/css" media="screen"><!--
#layer1    { visibility: visible; position: absolute; top: 50px; left: 18px;
width: 370px; height: 100px; overflow: auto }
--></style>
	</head>

	<body bgcolor="#ffffff">
		<p><a href="#" onclick="document.getElementById( 'layer1' ).style.overflow =
'Hidden'; document.getElementById( 'layer1' ).style.visibility =
'Hidden';">Hide</a> | <a href="#" onclick="document.getElementById( 'layer1'
).style.visibility = 'Visible'; document.getElementById( 'layer1'
).style.overflow = 'auto';">Show</a></p>
		<div id="layer1">
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.<br>
			This is my text.</div>
	</body>

</html>

Comment 2

13 years ago

*** This bug has been marked as a duplicate of 187435 ***
Status: UNCONFIRMED → RESOLVED
Last Resolved: 13 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.