CODEWITHSUNDEEP
css
user1472100
user1472100

Reputation: 11

How do I center left-justified text?

Here's the ugly code that works:

<table style="margin: auto"><tr><td>
Name: Fred Flintstone<br>
Home: Bedrock<br>
Favorite activity: Going to the drive-in and eating a brontosaurus burger!
</td></tr></table>

My goal is to center a block of left-justified text. The only way that I know how to do it at this point is to try to measure/guess the width of the necessary containing div. "Ok, maybe 400px. No, that causes it to wrap... Let's try 450."

What I really need is some code to create a container that will allow me to put any text within it and have it resize itself to that width.

Upvotes: 0

Views: 199

Answers (1)

Sirko
Sirko

Reputation: 74106

You could also use some <div> containers as follows (example fiddle):

<div id="container">
    <div id="content">
      Name: Fred Flintstone<br>
      Home: Bedrock<br>
      Favorite activity: Going to the drive-in and eating a brontosaurus burger!
    </div>
</div>

and this CSS:

#container {
    text-align: center;
}

#content {
    display: inline-block;
    text-align: left;
}

Upvotes: 3

Related Questions