Jump to content
  • Advertisement
Sign in to follow this  
shadowstryker

[web] CSS List troubles (2 different problems)

This topic is 4837 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Problem 1: ============================================== I've got a list being used as a horizontal menu. In IE this looks perfect and fills all 720px of the width. In Firefox it has 2 rendering errors, first is that 1/2 way thru the menu it suddenly drops down by about 5px, and also the DIV it is in has a width of 720px, yet it doesn't span 720px (yet as I said, it does in IE). (see source box below for CSS code used) Problem 2: ============================================== This one is slightly more complicated, I have dropdown menu's from my horizontal menu; this works perfectly in FF, but not at all in IE.
#linkbar {
	margin: 0px;
	padding: 0px;
	width: 720px;
	background-color: #006699;
}
#linkbar ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	list-style: none;
}
#linkbar ul li {
	position: relative;
	float: left;
	height:18px; 
	background-color: #006699;
	color: #FFFFFF;
	border-bottom: 1px solid black;
	padding: 0px;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
	background-repeat: no-repeat;
	background-image: url(art/interface/divider.gif);
}
#linkbar ul li:hover {
	background-color: #C0D6E2;
	color: #000000; cursor: pointer;
}
#linkbar ul li ul {
	display: none;
	position: absolute;
	top: 19px;
	width: 149px;
	filter: alpha(opacity=90);
	-moz-opacity: 0.9;
	opacity: 0.9;
	khtml-opacity: 0.9;
}
#linkbar ul li ul li {
	width: 100px;
}
#linkbar li a {
	display: block;
	text-decoration: none;
	color: #FFFFFF;
}
#linkbar ul li a:hover {
	background-color: #C0D6E2;
	color: #000000;
}
#linkbar ul li:hover ul, #linkbar ul li.over ul {
	display: block;
}


e.g. of use:
<div id='linkbar'><ul><li><a href='#'>item 1</a><ul><li><a href='#'>sub item 1</a></li></ul></li></ul>

Share this post


Link to post
Share on other sites
Advertisement
Sign in to follow this  

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

We are the game development community.

Whether you are an indie, hobbyist, AAA developer, or just trying to learn, GameDev.net is the place for you to learn, share, and connect with the games industry. Learn more About Us or sign up!

Sign me up!