CODEWITHSUNDEEP
csscenteralignment
Scott Rowley
Scott Rowley

Reputation: 484

Centering content issue

Can anyone tell me what I need to do in order to get the following page to center the contents correctly?

I've been trying to work with something else I used earlier in the day from here:

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

But this isn't working for me. One of the pages I need help with is here: REDACTED

Thank you for any help, I'm just trying to get this fixed before I can head off to bed :\

Upvotes: 1

Views: 133

Answers (6)

Zo Has
Zo Has

Reputation: 13038

Try this #divWrapper {margin:0 auto; text-align:center;width:960px} 

#div {text-align:left;width:500px}

Edit:enter image description here There are typing mistakes in your CSS. Check this updated CSS for margin-inner & margin-inner-right. It will fix your problem

#main-inner {
        float:left;
        position:relative;
        width:100%;
        border-top:3px solid #dadada;
        margin-top:20px;
        margin-right:auto;
        margin-left:auto;
}


#main-inner-right {

        position:relative;
        width:640px;
        text-align:left;
        margin-top:20px;
        margin-right:auto;
        margin-left:auto;
}

Upvotes: 0

Joseph
Joseph

Reputation: 119877

#main-inner {
    position: relative;
    width: 960px;
    border-top: 3px solid #DADADA;
    margin: 20px auto 0;
    overflow:auto;
    zoom:1;
}

try this one. replace the existing with this. it should center the content.

Upvotes: 3

Ethan Brown
Ethan Brown

Reputation: 703

You might also need to specify text-align:center; if you want the actual div contents centered.

Upvotes: 1

Andres I Perez
Andres I Perez

Reputation: 75409

You can only center elements with margin:0 auto when you provide a fixed width from which the margins can position themselves from automatically. So add a fixed with to your wrapper and it should work.

Upvotes: 1

kinakuta
kinakuta

Reputation: 9037

Give your #divWrapper a width. By default the width will expand as far as the containing element, so to create the appearance of it being centered, its width needs to be less than its containing element.

Upvotes: 1

Philip
Philip

Reputation: 4592

It needs a width! to work correctly.

Upvotes: 2

Related Questions