tailwindlabs / discuss

A place to ask questions, get help, or share what you've built with Tailwind CSS.
MIT License
171 stars 9 forks source link

Text area full width works but full height doesn't #436

Open Sparkenstein opened 4 years ago

Sparkenstein commented 4 years ago

not sure if this is a bug in tailwind or I am doing something wrong. probably it's just me because I can't see any such previous issue anywhere. I am trying to create a pastebin ui for practice. this is my html:

  <body class="h-screen w-screen bg-gray-800">
    <div class="">
      <textarea class="rounded-lg resize-none w-full h-full"></textarea>
    </div>
  </body>

Here my text area is getting full width but not full height. What am I missing? I tried another approach with flexbox too, which was not working for me at all. What is the better way to do this?

cytRasch commented 4 years ago

Height of an element is relative to its parent. Thus, if you want to make expand your element into the whole height, you need to apply your CSS to div as well.

  <body class="h-screen w-screen bg-gray-800">
    <div class="h-full">
      <textarea class="rounded-lg resize-none w-full h-full"></textarea>
    </div>
  </body>