No replies
Da Devil
Offline
Regular
The Netherlands
Last seen: 18 years 6 weeks ago
The Netherlands
Timezone: GMT+1
Joined: 2004-10-17
Posts: 11
Points: 0

When i use lists in a diversion, FireFox handles margins in a different way than IE. I wanted to have a h2, and below a list, that's 10px to the right. but when i set the margin to -10px (don't know the exact number), firefox handles it right (i guess), the list goes 10 px to the left of it's position (and a little), but IE counts from the left of the diversion, not from it's position where it is.
Is there a way to avoid this?

<html> 
 
<head> 
<style type="text/css"> 
body { 
	font-family: arial,sans-serif; 
	font-size: 12px; 
} 
 
#Menu { /* menu */ 
	width: 150px; 
	border: 1px dashed #333; 
	float: left; 
	margin: 2px 7px 2px 2px; 
	padding: 5px; 
} 
 
#Menu p:first-letter { font-weight: normal; font-size: 100%; } 
 
 
#Menu h3 { 
	margin-top: 0px; 
} 
 
#Menu ul {	 
	list-style-type: circle; 
	margin-left: 0px; 
} 
 
#Menu ul li { 
	margin: 0px; 
} 
</style> 
</head> 
 
<body> 
<div id="Menu"> 
  <h3>Menu:</h3> 
  <ul> 
    <li><a href="#">Item #1</a></li> 
    <li><a href="#">Item #2</a></li> 
	<li><a href="#">Item #3</a></li> 
	<li><a href="#">Item #4</a></li> 
	<li><a href="#">Item #5</a></li> 
  </ul> 
</div> 
</body> 
 
</html>


example (hosted @ lycos)

~Thanks

[edit]

I think i've done it. I positioned the list relative, and gave it a negative number (left: -15px;) and that is the same in both browsers.. Smile