...

View Full Version : vertical <UL> messing around in IE



bazz
03-11-2005, 07:01 PM
Hi,

I'm having difficulty with a left navmenu in a <ul><li> where I'm trying to make it move tighter to the left. If I tell it to have a margin of -10px (either the <ul> or the <li>, it is OK in FF but off the screen in IE

I just dont seem to be able to work it out.

css


div#productnavbar1 {
float : left;
#background-color: #785B83;
background-image : url('images/menubkgrnd.jpg');

width : 190px;
border : 1px solid #e5f9ff;
text-align: left;
margin-left : 0;

}

div#productnavbar1 h3 {
font-family : "Trebuchet MS", verdana, sans-serif, arial, helvetica;
font-size : 1.1em;
margin-left : 20px;
padding-top : 10px;
}

div#productnavbar1 ul {
background-color: transparent;
display: block;
white-space: nowrap;
margin-top : -15px;



}

div#productnavbar1 ul li
{
display : block;
list-style-type: none;
line-height : 25px;
border-bottom : 1px solid #000040;
background-color : transparent;

}

div#productnavbar1 ul li a:link, div#productnavbar1 ul li a:visited, div#productnavbar1 ul li a:active {
color: #000040;
text-decoration: none;
font-size : .9em;
font-weight : normal;

}


div#productnavbar1 ul li a:visited {
background-color: transparent;
color : #000040;

}

div#productnavbar1 ul li:hover {
background-color: #ffffff;
color : #000040;

}


html


<div id="productnavbar1">
<h3>Tailored Solutions</h3>
<ul>
<li><a href="http://mydomain.com/bed_and_breakfasts.php">CHRIS&trade; for Bed &amp; Breakfast</a></li>
<li><a href="http://mydomain.com/guesthouses.php">CHRIS&trade; for Guesthouses</a></li>
<li><a href="http://mydomain.com/hotels.php">CHRIS&trade; for Hotels</a></li>
<li><a href="http://mydomain.com/restaurants.php">CHRIS&trade; for Restaurants</a></li>
<li><a href="http://mydomain.com/self_catering.php">CHRIS&trade; for Self-Catering</a></li>
</ul>
<h3>Components Explained</h3>
<ul>
<li><a href="http://mydomain.com/photography.php">CHRIS&trade; ProPics&trade;</a></li>
<li><a href="http://mydomain.com/internetimagery.php">CHRIS&trade; ProImages&trade;</a>&nbsp; &nbsp;<a href="http://cms.mydomain.com/cgi-bin/thechrissystem/imaging/choose.pl">Demo</a></li>
<li><a href="http://mydomain.com/vrimagery.php">CHRIS&trade; Interactive&trade;</a></li>

<li><a href="http://mydomain.com/contentmanagement.php">CHRIS&trade; EasyEdit&trade;</a></li>
<li><a href="http://mydomain.com/accommodator.php">CHRIS&trade; Accommodator&trade;</a></li>
<li><a href="http://mydomain.com/confab.php">CHRIS&trade; Confab&trade;</a></li>
<li><a href="http://mydomain.com/consulting.php">CHRIS&trade; Consulting</a></li>
<li><a href="http://mydomain.com/">Full Demo</a></li>


<li><a href="http://tmydomain.com/terms.php">Terms &amp; Conditions</a></li>


</ul>
</div>



Bazz

bazz
03-11-2005, 07:06 PM
got it working better. I ahd been applying margin-left to everywhere other than <li>. :rolleyes:

Bazz



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum