Css center div not working

Question

I want to focus the speaker of the div that is in the div overview. I can't get it to work .:(

HTML:

<div class="review"> <div class="speaker"> <p>SPEAKER DIV</p> </div> </div> 

CSS

 .speaker{ align:center; } 

This does not work:/

Answer 1

There is no CSS property like align .

When you say you want to “center” the speaker div, what exactly do you mean?

You can center your text as follows:

 .speaker { text-align:center; } 

(see http://jsfiddle.net/pauldwaite/X7LN5/ )

If, as an alternative, you want the dynamic div to be only wider than its text, and located in the center of the overview div, then you will need to use this:

 .review { text-align:center; } .speaker { display:inline-block; } 

(see http://jsfiddle.net/wxha4/ )

Answer 2

Give it the width and margin: 0 auto;

 <div class="review"> <div class="speaker"> <p>SPEAKER DIV</p> </div> </div> div.speaker{ background-color:red; width:100px; margin:0 auto; } 

Look at the action!

Answer 3

I'm late to the party, but here goes:

In most browsers this will work:

 .speaker{ margin: 0 auto; } 

However, in IE8 and below, margin:auto will not work (IE8, only if not! DOCTYPE declaration. See the W3Schools horizontal alignment tutorial )

In this case, you can use a combination of text-align: center and width to get the desired effect:

 .review{ text-align:center; } .speaker{ text-align:left; width:200px; margin:0 auto; } 

The disadvantage of this method is that you have to declare the width or not to center.

Good luck

Answer 4

It works great.

 .speaker{ margin: 0 auto; text-align:center; width:100%; 

}

luck

Answer 5

to try

 .speaker p{ text-align:center; } 

or

 .speaker { text-align:center; } 

Answer 6

This is because this syntax does not exist. You need to center the div using the margin attribute.

 .speaker{ margin:0px auto 0px auto; } 

DEMO http://jsfiddle.net/t4kBj/

Answer 7

There is no align attribute in CSS. Set horizontal margins to automatically center the block. See Centering using CSS for more details (including issues around Internet Explorer)