Closed Bug 263215 Opened 20 years ago Closed 20 years ago

apparent incorrect rendering of links

Categories

(Firefox :: General, defect)

x86
Windows XP
defect
Not set
normal

Tracking

()

VERIFIED DUPLICATE of bug 263176

People

(Reporter: oboesax, Assigned: bugzilla)

Details

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; rv:1.7.3) Gecko/20040913 Firefox/0.10.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; rv:1.7.3) Gecko/20040913 Firefox/0.10.1

The links in a floated-left menu do not work if they are parallel with an image
located in another div.  see "steps to reproduce" for page source.  It displays
"correctly" in IE and Opera7 but not in firefox.  It seems to have something to
do with floating the divs... possibly with the negative margins... but the
behavior is definately affected by the presence of an image in the right-hand div

Reproducible: Always
Steps to Reproduce:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>page title</title>
<style>
/*--- Page header ---*/
.header {font-family: Verdana, sans-serif;}
.header h1 {
	font-weight: bold;
	font-size: 1.5em;}


/*--- Content container ---*/
.container {
	position: relative;
	clear: both;
	width: 100%;}


/*--- Content styles ---*/
#main h1, #main h2, #main h3 {
	font: 1.5em Verdana, sans-serif;
	margin: 0;
	padding: 0;}
#main h2 {
	font-size: 1.25em;
	padding-top: 0.25em;}
	
#main h3 {
	font-size: 1.1em;
	padding-top: 0.25em;}


/*--- Page footer ---*/
#footer {
	font: italic 0.6em Verdana, sans-serif;
	text-align: right;}
html, body {
	margin: 0;
	padding: 0;}
body {
	width: 100%;
	background-color: #022C6B;}


/*--- Page header ---*/
.header {
	color: #FFF;}
.header h1 {
	padding: 15px 210px 10px 0;
	margin: 0;}
.header img {
	border: 0;
	float: left;
	margin: 5px;}


/*--- Content container ---*/
.container {
	width: 100%;
	float:right;
	margin-left:-180px;}


/*--- Navigation menu---*/
#nav {
	width: 175px;
	float:left;
	background-color: #E5F0FF;
	border-right: 1px solid #666;}
#nav ul, #nav li, #nav ul ul {
	list-style: none;
	padding: 0;
	margin: 0;}
#nav li {display: inline;}
#nav ul ul {border-bottom: 1px solid #022C6b;}

/*--- Main topic links ---*/
#nav a, #nav a:visited {
	display: block;
	text-decoration: none;
	font: 0.75em Verdana, sans-serif;
	color: #000;
	padding: 0.5em 0;
	margin: 0;}

/*--- Sub-topic links ---*/
#nav ul ul a, #nav ul ul a:visited {
	padding-left: 15px;
	background: transparent url(../images/button.gif) 4px 50% no-repeat;
	border-bottom: 1px solid #999;}
#nav ul ul a:hover {
	color: #FFF;
	background-color: #022C6B;
	background-image: url(../images/hover.gif);}

/*--- Current section link styles ---*/
#nav a#current {
	background: #999 url(../images/current.gif) 5px 50% no-repeat;
	color: #FFF;
	font-weight: bold;}
#nav a.navhead, #nav a.navhead:visited, #nav a#currenthead:hover {
	color: #FFF;
	font-weight: bold;
	padding: 1.25em 0 0.25em 0.25em;
	margin: 0;
	background: #4C6B99 none;
	border-bottom: 1px solid #022C6B;}
#nav a.navhead:hover {color: #022C6B; background: #CCC none;}
#nav a#currenthead, #nav a#currenthead:hover {background-color: #093;}


/*--- Curriculum subtopics --*/
#nav ul#curriculum {background-color: #CCC;}
#nav ul#curriculum a, #nav ul#curriculum a:visited {
	padding-left: 25px;
	background: none;
	/*background: transparent url(../images/button.gif) 10px 50% no-repeat;*/
	border-bottom: 1px solid #999;}
#nav ul#curriculum a:hover {
	color: #FFF;
	background-color: #022C6B;
	/*background-image: url(../images/hover.gif);*/}
#nav ul#curriculum a.subhead{
	padding-left: 15px;
	color: #FFF;
	background-color: #2F476C;
	font-weight: bold;}

/*--- Curriculum current link styles ---*/
#nav ul#curriculum a#currentsub {
	background-color: #999;
	color: #FFF;
	font-weight: bold;
	border-top: 1px solid #666;}



/*--- Content styles ---*/
.container #main {
	margin-left: 180px;}
#main h1 {font-weight: bold;}
#main h1#topic {display: none}


/*--- Page footer ---*/
#footer {
	padding: 0.5em 1em 3em;
	margin: 0;
	color: #ccc;
	clear:both;}


/*--- Variable page image ---*/	
.kid {
	width: 200px; height: 250px;
	float:right;
	padding: 0px;
	margin: 10px;}
	
/*--- Empty Div for formatting ---*/
.clearing {
	height: 0;
	clear:both;}

/*--- outer-container div so that white background goes to bottom of longest
element ---*/
#wrapper {
	background: #fff url(../images/fauxcolumn.gif) repeat-y left;}

</style>
</head>

<body>
<div class="header">
	<a href="http://www.mozilla.org"><img
src="http://www.mozilla.org/images/product-front-mozilla.png" alt="moz" 

width="55" height="55" /></a>
	<h1>page title</h1>

</div>
<div class="clearing">&nbsp;</div>
<div id="wrapper">
	<div class="container">
		<div id="main"><p></p>
			<!-- BEGIN - This is the only section that should differ from page to page -->
			<img id="kids"
src="http://www.mozillastore.com/images/products/medium/44.jpg" alt="" 

style="padding-bottom: 20px;float:right;" />
			<h1>more Titles</h1>
			<p>Body text goes here</p>
			<!-- END - This is the only section that should differ from page to page -->
		</div>
	</div>
	<div id="nav">
		<ul>
		<li><a href="index.htm" class="navhead" id="currenthead">link <br />number
1</a></li>
		<li><ul id="sub1">
			<li><a href="forms.htm">Forms</a></li>
			<li><a href="policiesandprocedures.htm">Policies &amp; Procedures</a></li>
			<li><a href="curriculum.htm">Curriculum</a></li>
			<li><a href="trainingcalendar.htm">Training Calendar</a></li>
			<li><a href="contactus.htm">Contact Us</a></li>
			</ul>
		</li>
		<li><a href="contractedprograms.htm" class="navhead">Contracted Programs</a></li>
		<li><a href="morecontractedprograms.htm" class="navhead">More Contacted
Programs</a></li>
		</ul>
	</div>
<div class="clearing">&nbsp;</div>
</div>
<div id="footer">Copyright &copy; ME</div>
</body>
</html>

Actual Results:  
I've modified the page so that the code should work as-is (no image downloading
or folder setup required).  see for yourself.  I can't access the links in the
lefthand navigation

Expected Results:  
should let me click on the links

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