minusten — 2012-03-04T22:20:30-05:00 — #1
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
<a href="Index.html"> <img src="Images/nav.png" width="250px" height="" alt="we" /></a>
<li><a href="Services.html" alt="Popular services"> Services</a></li>
<li><a href="Portfolio.html"alt="Popular services">Portfolio</a></li>
<li><a href="About.html"alt="Popular services">About us</a></li>
<li><a href="Contact-us.html" alt="Popular services"> Contact </a> </li>
margin: 0 auto;
margin:30px auto 30px;
minusten — 2012-03-04T22:26:54-05:00 — #2
just got this figured out to --embarassed......
Why do i need to assign a width when im using margin:0 auto;???
dresden_phoenix — 2012-03-04T22:54:43-05:00 — #3
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.
ryanreese — 2012-03-04T23:22:09-05:00 — #4
Almost correct, although it may seem to be the same, the width is actually auto by default, which differs slightly from 100% :).
dresden_phoenix — 2012-03-04T23:46:04-05:00 — #5
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.
ryanreese — 2012-03-05T00:01:37-05:00 — #6
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 :).