Isaiah Bugarin
Isaiah Bugarin

Reputation: 493

Text-align justify not working?

I'm working on a website and I have this CSS:

#aboutMe
{
    position:relative;
    left:20px;
    top:20px;
    behavior: url(/PIE.htc);
    -webkit-border-radius: 400px;
    -moz-border-radius: 400px;
    border-radius: 400px;
    background:#48c7ff;
    width:400px;
    height:400px;
    font-family:'Ciclef';
    color:#e9e9e9;
    padding:35px;
    line-height:25px;
}

#aboutMe p
{
    text-align:justify;
    font-size:16px;
}

However, the text isn't justified, it's left aligned. How can I fix this?

Here's the website: http://ibdesigns.net23.net/

The "About Me" circle (about halfway down the page) is the paragraph giving me trouble.

Upvotes: 3

Views: 17697

Answers (2)

Akshay Khandelwal
Akshay Khandelwal

Reputation: 1570

And by the way, did you observe the same <div>? The text is moving out of the image; you may consider a small CSS change:

#aboutMe p {
    text-align: justify;
    text-align-last: center;
    font-size: 16px;
    margin-left: 15px;
}

I added margin-left: 15px;.

Upvotes: 0

Evan Mulawski
Evan Mulawski

Reputation: 55334

That text is justified. The last line in a justified paragraph does not get stretched (or compressed) to fit on that line.

To make it look better (in CSS3 browsers that support text-align-last), you could do:

text-align:justify;
text-align-last:center;
/* for IE9 */
-ms-text-align-last:center;

Upvotes: 14

Related Questions