How Can Align Text In A Center In Left Position?

I have this sample: http://jsfiddle.net/3gmeK/298/ CSS and HTML: I want my text in its current form is aligned in the center. I do not want to use 'text-align: center;' Inside thi

Solution 1:

This can be done by adding an extra span around the text:

• Add text-align: center; to p
• Add an extra span around the text
• Add a new span selector with display: inline-block; to make the span center in relation to the p and text-align: left; to shift it's text to the left

div {
  background-color: #F51;
  padding: 10px 20px;
}
p {
  background-color: #333;
  color: #fefefe;
  padding: 5px;
  text-align: center;
}
span {
  display: inline-block;
  text-align: left;
}

<div>
  <p>
    <span>There are many fish in the sea! So lovely!<br>
            many fish in the sea! So lovely!</span>
  </p>
</div>

Solution 2:

You can also try this,

Add <span> tag for content and add this css

p span{ display: table;margin:auto;}

http://jsfiddle.net/3gmeK/304/