0

I have an issue with my css ul menu bar not displaying AT ALL in IE 7. Works perfectly in FF, IE 8 and Safari 4. Displays but not correctly in Safari 2. Can someone take a look at the code and give me the necessary fixes?

Here's the url: www.monzomarketing.com/test/index.htm

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Monzo Marketing: Our People</title>
<link rel="stylesheet" type="text/css" href="./monzo.css" media="all" />
<!--[if IE]>
<style type="text/css" media="all">.borderitem {border-style:solid;}</style>
<![endif]-->

</head>



<body>

<div id="wrapper">

	<img src="images/header.jpg" id="header"  alt="Monzo Marketing" />
		<br class="clearfloat" />

        
<div id="content">


  <div id="leftbar"> <img src="images/people_hdr.gif" id="people_hdr"  alt="" /> <br class="clearfloat" />
  </div>
    
    <div class="TextPeople" id="phototext">
      <p><strong><img src="images/tony.jpg" width="98" height="136" class="floatLeft" />Tony Monzo, President</strong><br/>
      <p>Tony has 35 years of restaurant and hospitality marketing experience. Corporate positions included:<p/>

          <ul>
            <li>Vice President of Marketing for Hardee’s<br />
            <li>Vice President of Marketing for Checker’s<br />
            <li>Executive Vice President of Marketing, Bojangles<br />
            <li>Director of Marketing for Marriott Restaurant Group (Roy Rogers, and Marriott Dinner Houses)</li>
</ul>

        After that, he founded Monzo Marketing, a promotion and marketing agency that he has run for 15 years, serving a wide variety of clients with focus on promotion, collateral work, print advertising, local store marketing and eClub marketing.<p/><br/><br/>
     <p>
     <p><strong><img src="images/steve.jpg" width="98" height="136" class="floatLeft" />Steve Hickey, Sr.Vice President, Account Service</strong><br/>
     <p> Steve has 40 years of restaurant and hotel marketing experience. Corporate positions included:<p/>

          <ul>
        <li>Vice President of Marketing for Hardee’s and Wendy’s<br />
        <li>SVP of Marketing for TGI Friday’s<br />
        <li>SVP of Marketing for La Quinta Inns &amp; Suites<br />
        <li>Chief Marketing Officer for Buca di Beppo (Buca, Inc.)<br />
        <li>Staff Director/National Marketing, McDonald’s Corp<br />
        <li>Director of Marketing for Marriott Restaurant Group (Roy Rogers, and Marriott Dinner Houses)</li>
          </ul>

Steve left corporate life to pursue marketing consulting for several firms through his own consulting company, S.Hickey &amp; Associates. He has now joined Monzo in order to synergize his experience with Tony’s team.<p/><br/><br/>
      <p>
      <p><img src="images/michael.jpg" width="98" height="135" class="floatLeft" /><strong>Michael Loving, Vice President, Creative Director</strong><br/>
      <p>Michael has over 30 years of agency experience, including large agencies such as McCann and Esty in New York, as well as smaller agencies. He has worked on accounts including:</p>
      <ul>
        <li>Coca Cola<br />
        <li>McDonald’s<br />
        <li>Nissan<br />
        <li>RJR<br />
        <li>Nabisco<br/>
      </ul>
          He has been recognized with numerous Addy and Clio awards. He is also an accomplished musician and tri-athlete and has worked for Monzo for over 11 years.<p/><br/><br/>
      <p>
      <p><strong><img src="images/dorota.jpg" width="98" height="135" class="floatLeft" />Dorota Goch-Miller, Art Director</strong><br/>
      <p>Dorota has over 14 years of experience in creative and production. She is a graduate of European Academy of Fine Arts in Warsaw with MFA, and the Art Institute of Atlanta with BFA in Graphic Design. She has won several fine arts awards and done work for companies including:</p>
      <ul>
        <li>Delta Airlines<br />
        <li>Home Depot<br />
        <li>Turner Networks<br />
        <li>World Championship Wrestling (you don’t see clients like that every day!)<br />
        <li>Cinnabon<br />
        <li>Church’s Chicken<br /><br/>
        </li>
      </ul>
      <p></p><br/>
      <p><strong><img src="images/terri.jpg" width="98" height="135" class="floatLeft" />Terri Cooper Day, Designer</strong><br/>
      Terri has over 20 years creative and account management experience. She has worked both on agency and client side. She is a graduate of Art Institute of Atlanta and worked as project manager for Coca Cola, and has done work for companies including:</p>
      <ul>
        <li>Nortel<br />
        <li>Cingular Wireless<br />
        <li>SunTrust Bank<br />
        <li>Peachtree Software<br/><br/>
        </li>
      </ul>
  </div>
    
    <link href="single_four.css" rel="stylesheet" type="text/css" />
    <ul id="menu">
      <li id="home"><a href="index.htm"><b>Home</b></a></li>
      <li id="people"><a href="people.htm"><b>People</b></a></li>
      <li id="services"><a href="services.htm"><b>Services</b></a></li>
      <li id="clients"><a href="clients.htm"><b>Clients</b></a></li>
      <li id="work"><a href="work.htm"><b>Work</b></a></li>
      <li id="contact"><a href="contact.htm"><b>Contact&nbsp;Us</b></a></li>
    </ul>

  <div id="footer">©2009 Monzo Marketing. All rights reserved.</div>

       
<!--end of content (formerly "wrap"-->
</div>

<!--end of "wrapper"-->
</div>

</body>


</html>

And here's the CSS

body {
	margin:0px;
	padding:0px;
}
.clearfloat {
	clear:both;
	height:0px;
}

#header {
	margin-left:0px;
	margin-top:0px;
	width:900px;
	height:143px;
	margin-bottom:0px;
	float:left;
	display:inline;

}
#leftbar {
	width:210px;
	padding-top:0px;
	margin-left:0px;
	margin-top:0px;
	margin-bottom:0px;
	float:left;
	display:inline;
	height: auto;
}
#people_hdr {
	margin-left:11px;
	margin-top:42px;
	width:184px;
	height:54px;
	margin-bottom:0px;
	float:left;
	display:inline;

}
.Text{
	width:586px;
	float:right;
	font-size:11px;
	font-family:Verdana, Geneva, sans-serif;
	font-weight: normal;
	text-align: left;
	color: #333333;
	line-height: 120%;
	padding-bottom:0px;
	min-height: 100%;
	margin-right: 70px;
	margin-top: 75px;
	padding-top: 0px;
	margin-bottom: 50px;
	list-style-position: inside;
	list-style-type: disc;
}
#leftnav {
	font-weight: bold;
	text-align: left;
	width: 210px;
	list-style-type: none;
}

/*thisis nav bar*/

#menu {
	padding:0;
	list-style:none;
	height:50px;
	background:url(ulback.gif) repeat-x;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0px;
	position: absolute;
	left: 211px;
	top: 0px;
	z-index: 200;
}
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssmenus.co.uk
Copyright (c) 2009- Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#menu li {float:left;}
#menu li a {
	display:block;
	height:50px;
	line-height:25px;
	padding:0 20px 0 0;
	float:left;
	color:#fff;
	text-decoration:none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: lighter;
	font-style: normal;
	background-image: url(images/tab_a.gif);
	background-repeat: no-repeat;
	background-position: right -25px;
}
#menu li a b {
	display:block;
	height:50px;
	float:left;
	padding:0 0 0 20px;
	cursor:pointer;
	background-image: url(images/tab_b.gif);
	background-repeat: no-repeat;
	background-position: left -25px;
}
#menu li a:hover,
#menu li a:active,
#menu li a:focus,
.home #menu li#home a,
.single #menu li#single a,
.dropdown #menu li#dropdown a,
.dropline #menu li#dropline a,
.flyout #menu li#flyout a,
.support #menu li#support a,
.contact #menu li#contact a
{
	line-height:50px;
	color:#fff;
	background-image: url(images/tab_a.gif);
	background-repeat: no-repeat;
	background-position: right -10px;
}
#menu li a:hover b,
#menu li a:active b,
#menu li a:focus b,
.home #menu li#home a b,
.single #menu li#single a b,
.dropdown #menu li#dropdown a b,
.dropline #menu li#dropline a b,
.flyout #menu li#flyout a b,
.support #menu li#support a b,
.contact #menu li#contact a b
{
	line-height:50px;
	background-image: url(images/tab_b.gif);
	background-repeat: no-repeat;
	background-position: left -10px;
}

#bkgd {
	background-color: #FFF;
	background-image: url(images/bkgd_1px.jpg);
	background-repeat: repeat-x;
	width: 690px;
	height: 200px;
	display: block;
	float: right;
	margin-top:0px;
}

#content {
	width:900px;
	background-image: url(images/bkgd_tan_tan900px.gif);
	background-repeat: repeat-y;
	position: absolute;
	top: 143px;
	min-height: auto;/* was 100% until trying to get home page to bottom out  */
	height: auto;
}


#footer {
	position: relative; /* negative value of footer height */
	height: 15px;
	clear:both;
	color: #FFF;
	background-color: #900;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: normal;
	width: 900px;
	margin-top: 15px;
	line-height: 16px;
} 

#wrapper {
	width:900px;
	height: auto;
	min-height: 100%;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}


.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}

.TextPeople {
	width:750px;
	float:left;
	font-size:11px;
	font-family:Verdana, Geneva, sans-serif;
	font-weight: normal;
	text-align: left;
	color: #333333;
	line-height: 120%;
	min-height: 100%;
	margin-top: 0px;
	margin-left: 100px;
	padding: 0px;
	list-style-position: inside;
	list-style-type: disc;
}

img.floatLeft {
	float: left;
	margin-top: 0px;
	margin-right: 48px;
	margin-bottom: 60px;
	margin-left: 0px;
}
img.floatRight { 
    float: right; 
    margin: 12px; 
}
.TextHome {
	width:820px;
	float:left;
	font-size:12px;
	font-family:Verdana, Geneva, sans-serif;
	font-weight: normal;
	text-align: left;
	color: #333333;
	line-height: 150%;
	padding-bottom:0px;
	min-height: 100%;
	margin-right: 0px;
	margin-top: 50px;
	padding-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
img.floatLeftNoBtm {
	float: left;
	margin-top: 0px;
	margin-right: 48px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.leftnav {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 200%;
	font-weight: normal;
	text-align: left;
}
2
Contributors
1
Reply
2
Views
8 Years
Discussion Span
Last Post by Troy III
0

I have an issue with my css ul menu bar not displaying AT ALL in IE 7. Works perfectly in FF, IE 8 and Safari 4. Displays but not correctly in Safari 2. Can someone take a look at the code and give me the necessary fixes?

These are only some of structural errors found in your html code.

Validation Output: 21 Errors
# Error Line 46, Column 8: XML Parsing Error: Opening and ending tag mismatch: p line 33 and div
</div>
# Error Line 67, Column 7: XML Parsing Error: Opening and ending tag mismatch: div line 20 and body
</body>
# Error Line 70, Column 7: XML Parsing Error: Opening and ending tag mismatch: body line 18 and html
</html>
# Error Line 70, Column 7: XML Parsing Error: Premature end of data in tag div line 4
</html>
# Error Line 70, Column 7: XML Parsing Error: Premature end of data in tag html line 2
</html>
You should correct these before anybody tries to help you. Perhaps, the problem will go away by itself after you've done this. check out with the minimum height auto value firefox doesn't like that either. Try some other value or clear it altogether, its just sitting there.
Fast solution sugestion:

#content {
	width:900px;
	background-image: url(images/bkgd_tan_tan900px.gif);	background-repeat: repeat-y;	
	position: absolute;	
	top: 143px;
	min-height: auto;/*
 	height: auto;

delete both reds!

Edited by Troy III: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.