CODEWITHSUNDEEP
htmlcss
SB2055
SB2055

Reputation: 12912

How to get textarea to take up 100% of remaining space?

I have a div with the following structure: 

<div class = "card">
   <div class="menu">
      vertical menu here, pushed to the left
   </div>
   <div class ="content">
      <textarea> This should fill up everything in the card exept the menu div</textarea>
   </div>
</div>

I'm trying to get the 'textarea' to fill up the entire card while leaving the menu there. My jsfiddle shows it a little too wide and pushed to below the card div for some reason:

http://jsfiddle.net/PTSkR/105/

How can I get that textarea to fill up the remaining card space?

Upvotes: 5

Views: 1111

Answers (1)

Andrea Ligios
Andrea Ligios

Reputation: 50281

If you want something like this: http://jsfiddle.net/PTSkR/107/ ,

you can achieve it by using float:left for the menu, float:right for the textarea, and CSS3 Calc for calculating textarea's width, as in the example

Upvotes: 2

Related Questions