Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Bottom Margin in UL problem

Posted on 2007-07-31
3
Medium Priority
?
393 Views
Last Modified: 2010-10-05
Hello,

Here is another bug on my website, for which I need your expertise ;-) !!

Compare this in Mozilla and IE6 and check the last menu "Aluminium"

http://matthew16.free.fr/pvc/produits2.html

I want to seperate the two ul's "PVC" and "Aluminium"

I tried with this as a test :

#leftside ul.avmenu {
      list-style:none;
      margin:0 0 180px;
      padding:0;
      width:200px;
}


But you can see that it doesn't work well for both but especially for Mozilla.

Thank you for any help.
0
Comment
Question by:matthew016
  • 2
3 Comments
 
LVL 30

Expert Comment

by:Mark Steggles
ID: 19602731
Hello,

It's because the anchors are floated and the ul is not containing them... add float:left to the #leftside ul.avmenu and you will see your margin take effect

Cheers
Steggs
0
 
LVL 9

Author Comment

by:matthew016
ID: 19603427
if I understand the <a> elements were floated,
and they were out of the flow, so ul was not containing them.

But why by putting ul to float:left, they contain them suddenly ?

Thank you !
0
 
LVL 30

Accepted Solution

by:
Mark Steggles earned 2000 total points
ID: 19603910
cause a float will contain its floated children

an unfloated parent will not contain its floated children
0

Featured Post

Receive 1:1 tech help

Solve your biggest tech problems alongside global tech experts with 1:1 help.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
Suggested Courses
Course of the Month13 days, 20 hours left to enroll

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question