I want to set the height of a TextArea to 100% of

问题:

I want to set the height of a TextArea to 100% of its parent table cell in XHTML 1.0 Transitional. I looked around at other similar questions that expressed to me that the parent element needs to have an explicitly defined height value in order for the TextArea's height to be 100% of that value.

I have a table that is 100% of the height of the html and body wich are set to 100%.

However, if I put the Table Cell's value as 100% of its parent, the row as 100% of its parent, and the table as 100% of its parent, which is set to 100% of the client height, I'm guessing, the textarea fills the entire viewport.

How would I set the height of the TextArea as simply 100% of the table cell without referencing the height value of a parent element all the way up to the root, and getting a result far from what I am after?

Here's the code:

<table>
<tr>
<td>
<textarea rows="" cols="">
</textarea>
</td>
</tr>
<tr>
<td>
<textarea rows="" cols="">
</textarea>
</td>
</tr>
</table>

External CSS:

html, body {
height: 100%;
width: 100%;
}
table {
height: 100%;
width: 100%;
}
textarea {
height: 100%;
width: 100%;
}

NOTE: For some odd reason, the width property seems to assign fine without reference to a direct parent, but the height doesn't.

回答1:

Change your CSS to:

html, body {
height: 100%;
width: 100%;
}
table {
height: 100%;
width: 100%;
}
textarea {
height: 100%;
width: 100%;
}
td{
    height:50%;
}