heron
heron

Reputation: 3679

Having css issue

http://jsfiddle.net/JDwjJ/

Please take a look at this code

The problems are followings:

Upvotes: 0

Views: 48

Answers (2)

Jack
Jack

Reputation: 1472

For the

1.nav must be at the top of #main, not side by side;

just apply

clear:both

on the main div

2.How can I center #nav inside #container if I don't exact to set exact width for it? Tried margin: 0 auto; no success?

you have to set certain width for this content container by this margin 0 auto will work

update : please take a look if you need the same

http://jsfiddle.net/JDwjJ/9/

Upvotes: 2

sandeep
sandeep

Reputation: 92853

Remove unnecessary float form your #nav & ul. Then define width to your #nav for example 600px

#nav{
 width:600px;
}
#nav ul
{
    padding:0px;
    margin:0px;
    list-style:none;
    overflow: hidden;
}

Check this http://jsfiddle.net/JDwjJ/1/

UPDATED If the width is unknown then you can use display:inline-block property for this:

    #nav {
        display:inline-block;
        *display:inline/* For IE7*/
        *zoom:1/* For IE7*/
    }
    #container{
        text-align:center;
    }  
   #main{
        text-align:left;
   }

Check this http://jsfiddle.net/JDwjJ/8/

Upvotes: 2

Related Questions