CODEWITHSUNDEEP
htmlcss
Pavan573
Pavan573

Reputation: 81

working with css to align center

I have a html file with a div tag and some text in that tag. I want to adjust that text exactly middle of div and also div exactly middle of page for any resolution. I tried it with margin:0 auto then it appears top center, but vertically it does not appear in middle.

Upvotes: 0

Views: 268

Answers (6)

laymanje
laymanje

Reputation: 833

You have to set the container div with the css like this:

div{
    margin: 0 auto; /*= the 0 sets the top and bottom margin to zero and the auto centers the div =*/
    width: 940px;   /*= the width is a must have but can be set to the size you need =*/
    text-align: center; /*= use this if you want to center the text inside the div =*/
}

Upvotes: 0

Abhendra Singh
Abhendra Singh

Reputation: 1957

To adjust your div use this code:

margin-left: auto;
margin-right: auto;

And to make text in middle of div use this code:

text-align: center;

Upvotes: 0

Przemek
Przemek

Reputation: 3985

Here you are: http://jsfiddle.net/KcrvL/.

Upvotes: 0

defau1t
defau1t

Reputation: 10619

margin auto 0 will work only only you give width to your div. text-align:center will align text in the center.

Upvotes: 2

Coder
Coder

Reputation: 896

maybe you can try this, http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

Upvotes: 0

James
James

Reputation: 13511

The div needs CSS like this, depending on the rest of your HTML:

margin-left: auto;
margin-right: auto;
text-align: center;

That will align the div in the centre of its container and align the text within it to the centre also.

Edit - I've just noticed you want to vertically centre the div too. There are lots of ways of doing this that a quick Google would show up, such as this method: http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

Upvotes: 3

Related Questions