CODEWITHSUNDEEP
css
user505210
user505210

Reputation: 1402

align property in css

I have the below html.What I am trying to do is center the contents of the p tag.The thing is that if I do a align on the div then it works but when I do it in the p tag it does not.Not good with css and want quick solution so asking u guys for help.

<html>

    <head></head>

    <body>
        <div>
            <p align="center" style="width:500px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor neque augue. Mauris a ante et libero tincidunt lacinia. Donec at lorem eu mi sagittis pretium. Donec sed ligula vel nunc placerat auctor quis vitae est. Nullam varius leo sed elit auctor rutrum. Pellentesque at erat quis nibh eleifend tincidunt sed feugiat est. Fusce dolor ante, imperdiet in congue ut, vulputate vitae nisi. Vivamus hendrerit felis a leo laoreet eget mollis purus tempus. Etiam fringilla est lacus. Praesent quis purus sem. Vestibulum interdum scelerisque consectetur. Nam nulla est, lacinia in eleifend eget, ultricies at est. Phasellus congue sollicitudin tellus, sit amet lobortis odio interdum et. Quisque turpis elit, feugiat in laoreet mollis, tempus et leo. Morbi eget viverra enim. Donec nec lacus dolor. Suspendisse tincidunt mi in enim gravida et fringilla lacus ultrices. Integer ac augue at nulla sollicitudin placerat. Morbi et ligula quis mauris consequat egestas vel et sapien. Ut ut justo a augue ullamcorper egestas ullamcorper vel nisl. Cras quam ligula, pharetra at pulvinar et, scelerisque vel erat. Donec scelerisque metus vitae libero accumsan quis suscipit urna pretium. Curabitur imperdiet, turpis a pulvinar adipiscing, nibh felis fringilla felis, nec consequat felis justo accumsan est.</p>
        </div>
    </body>

</html>

Upvotes: 0

Views: 99

Answers (5)

Adrift
Adrift

Reputation: 59829

align is a deprecated attribute in HTML 5 .. instead give the <p> an explicit width and add:

margin: 0 auto; to center the entire element (top/bottom 0, left/right auto)

or

text-align: center; to center the elements text

Upvotes: 3

dsgriffin
dsgriffin

Reputation: 68616

That's because the property align is meant for divs. Also, it is deprecated, there are better ways to style your paragraphs than that.

Here's a jsFiddle example.

CSS:

div {
  width:100%;
}

p {
  text-align:center;
}

HTML:

<div>
    <p>Hello</p>        
</div>

Upvotes: 1

Aleks G
Aleks G

Reputation: 57336

Try 

<p style="width:500px;margin:auto">...</p>

Upvotes: 0

trajce
trajce

Reputation: 1490

I've just checked your problem, and actually the text is centered in your p tag. I think you are trying to move your p tag in the center of the div, and you can achieve that by 

p
{
margin:0 auto;
}

here is also a fiddle

just an advice: a good practice is to separate your styles from your html, so move all your styling to a separate style sheet.

Upvotes: 0

Oxon
Oxon

Reputation: 5041

Text is center aligned. I have tested it in latest IE, Chrome and Firefox.

You can try <p style="width:500px; text-align:center">

Upvotes: 1

Related Questions