CODEWITHSUNDEEP
htmlcsslayout
user380719
user380719

Reputation: 9903

How do I stretch a div vertically in a td?

I have a div inside a td. The td has a height. How I can stretch the div vertically - without setting its height explicitely.

<td style='height:200px'>
<div>hello<div>
<td>

I tried setting the vertical-alignment but there is no "stretch" value.

Upvotes: 0

Views: 2406

Answers (4)

BronzeByte
BronzeByte

Reputation: 725

Try this:
<div style="min-height:100%">
It will automaticly stretch if the text needs more space (vertically)

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114347

Try this:

td div {
   height:100%
}

Upvotes: 1

Smamatti
Smamatti

Reputation: 3931

Sample
http://jsfiddle.net/hnBNk/

HTML 

<table>
    <tr>
        <td style='height:200px; border: 1px solid red;'>
            <div style="border: 1px solid blue;">hello</div>
        </td>
    </tr>
</table>

CSS 

div { /* This is a sample! Of course a class 'my_div' would make more sense */
    height: 100%;
}

Upvotes: 2

Jan Turoň
Jan Turoň

Reputation: 32912

how about this?

<td style='height:200px'>
<div style="height:100%">hello<div>
<td>

OK, it is explicit definition, but it stretches according to parent element.

Upvotes: 0

Related Questions