Margin:0 auto;

hi all

working on nav bar i have two divs and am trying to centre them both ?

I have tried putting them in on div and assigning a class to the main one with no luck

any help would be great

<div class=“logo”>

<div class=“navcontain”>
<a href=“Index.html”> <img src=“Images/nav.png” width=“250px” height=“” alt=“we” /></a>

   &lt;ul class="navigation"&gt;

        		&lt;li&gt;&lt;a href="Services.html" alt="Popular services"&gt; Services&lt;/a&gt;&lt;/li&gt;
       			&lt;li&gt;&lt;a href="Portfolio.html"alt="Popular services"&gt;Portfolio&lt;/a&gt;&lt;/li&gt;
        		&lt;li&gt;&lt;a href="About.html"alt="Popular services"&gt;About us&lt;/a&gt;&lt;/li&gt;	
      			&lt;li&gt;&lt;a href="Contact-us.html" alt="Popular services"&gt; Contact &lt;/a&gt; &lt;/li&gt;			   			    				 				

margin: 0 auto;


margin:0 auto;

width: 500px;
margin:30px auto 30px;

just got this figured out to --embarassed…

Why do i need to assign a width when im using margin:0 auto;???

See my reply to your other post that should fix all your issues. As far as your current Q: block elements are 100% width by default. so it’s actually being centered you just cant see it since the auto end up being calculated to 0.

Almost correct, although it may seem to be the same, the width is actually auto by default, which differs slightly from 100% :).

Ok. Ryan brought up a good point the default SETTING = AUTO. Which does differ slightly from actually setting width:100% by the fact that padding and border will not be added to the calculated width. So I will rephrase , a block element with width:auto ( no width set) will by default extend from left edge f its parent to the right edge of its parent, and thus leave an "auto margin-left and auto margin right of 0 each.

I’ve had that nitpick happen to me before so I’m sorry I had to do it to you :).

It also looks like .logo will need some sort of clearing mechanism, aka overflow:hidden; on it :).