Home > Back-end >  Left align content inside a Tailwinds centered flex column
Left align content inside a Tailwinds centered flex column

Time:11-17

I have a centered column where I'd like to align some of the content inside this column to the left:

<div >

  <!-- I would like all elements to be left aligned in this div -->
  <div >
    <h1>Tailwind Elements</h1>
  </div>
  
</div>

How can I left align content in a flex column that is centered? I can not seem to make it work.

CodePudding user response:

Did you set width for the inner div? I set the width and used text-left and it seems to work

<div >

  <!-- I would like all elements to be left aligned in this div -->
  <div >
    <h1>Tailwind Elements</h1>
  </div>
  
</div>

Edit: you don't even have to use text-left as setting the width automatically sets all the items to be left aligned

  • Related