CODEWITHSUNDEEP
csscenter
Amruth Pillai
Amruth Pillai

Reputation: 1693

I'm not able to center my navigation using CSS

I have a CSS problem centering my navigation div and have tried many methods from the internet, but all in vain.

The link to the website is: http://trendgfx.com/projects/comet-tavern/

I've set it to center for my resolution (1280x1024) for now, but I don't know what to do to center it automatically! I've tried the most popular method:

div {
    margin: 0 auto;
    text-align: center;
}

I've also tried the other method:

div {
    width: 960px;
    margin-left: 50%;
    margin-right: 50%;
}

I've also tried the other 'frowned upon' method:

<center>[nav goes here]</center>

It didn't work, weirdly. I know it's dead in HTML5, but I was hoping it would do the trick! I really need to complete this project by July the 28th, so please help me, the gods of StackOverflow! :)

Thank you so much!

Upvotes: 0

Views: 87

Answers (2)

Geir Sagberg
Geir Sagberg

Reputation: 9821

I noticed you have the following css:

#navigation {
    clear: both;
    left: 275px;
    margin: 0 auto;
    position: absolute;
    text-align: center;
}

The absolute positioning may be screwing with you, try using relative positioning instead:

#navigation {
    clear: both;
    left: 0;
    margin: 0 auto;
    position: relative;
    text-align: center;
}

Upvotes: 1

Turnip
Turnip

Reputation: 36632

This workd for me:

#navigation {
    margin: 0 auto;
}

position: absolute; was messing it up

Upvotes: 1

Related Questions