Home > Software design >  How to justify-items of last columns differently than all others?
How to justify-items of last columns differently than all others?

Time:06-17

In excel we can choose if the text is centered, left, or right aligned in a cell based on which column it is in. I am trying to do the same thing using a grid in tailwindcss. Is there a way to specify which columns use "justify-items-center", "justify-items-start", and "justify-items-end"?

CodePudding user response:

You can use text-center, text-left and text-right accordingly to the respective cells to align the text accordingly

<script src="https://cdn.tailwindcss.com"></script>
<div >
  <div >
      <div >01</div>
      <div >01</div>
      <div >01</div>


      <div >01</div>
      <div >01</div>
      <div >01</div>


      <div >01</div>
      <div >01</div>
      <div >01</div>

</div>
</div>

CodePudding user response:

Use the justify-self-... classes to specify, which rows differ from the rest of the grid:

    <div >
      <!-- ... -->
      <!-- ... -->
      <!-- ... -->
      <!-- ... -->
      <!-- ... -->
      <div >02</div>
    </div>

  • Related