Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bootstrap left align text inside centered div

I have a paragraph of 4 lines that are poetry in a centered div. Because it is poetry, I need the 4 lines aligned left, but not to the left side of the div.

Here is how it is centered:

     Lorem ipsum dolor sit amet, 
        onsectetur adipisicin.
  Doloribus, totam unde facilis omnis 
        temporibus nostrum in

Here is how I want it:

  Lorem ipsum dolor sit amet, 
  onsectetur adipisicin.
  Doloribus, totam unde facilis omnis 
  temporibus nostrum in

Thanks.

JSFIDDLE

like image 500
Serhii Borovskyi Avatar asked Oct 03 '22 23:10

Serhii Borovskyi


2 Answers

Here is the solution http://jsfiddle.net/YW7eS/2/

I removed text-align: center and used the grid system to give you more control.

<div class="col-lg-offset-4 col-lg-4 col-md-offset-4 col-md-4 col-sm-offset-4 col-sm-4">
    ...
</div>
like image 200
RichC Avatar answered Oct 11 '22 08:10

RichC


Since you don't provide any code its quite hard to help you, but this is (I guess) what you want. Change the left padding to whatever number to increase/decrease the distance of the text to the div.

.poetry {
   padding: 0 0 0 20px;
}

.poetry p {
   text-align: left;
}
like image 44
Charles Ingalls Avatar answered Oct 11 '22 08:10

Charles Ingalls