CODEWITHSUNDEEP
htmlcss
Tomas
Tomas

Reputation: 13

CSS: Setting a specific table cell height in percentage of the screen?

Say that I have a table with two rows, and a cell in each. I want the first cell to have a height of 70% of the screen or webbrowser window.

If the height property is set in tr or td the cell get height in percentage of the table not the screen. I don't want the whole table in percentage of the screen because I want the second cell to be able to expand down without limit if content is added to it. Is that possible?

/Tomas

Upvotes: 1

Views: 7504

Answers (2)

fomicz
fomicz

Reputation: 1792

Set body margins and paddings to 0 in your stylesheet file:

body {
   padding: 0;
   margin: 0
}

Set your table's width to 100%:

<table style="width: 100%">

Set yours cell's width to 70%:

<table style="width: 100%">
   <tr>
      <td style="width: 70%">

And now forget all the above excepting body margin and padding and use:

    <div style="width: 70%"></div>
    <div></div>

Upvotes: 1

Sebastian Patane Masuelli
Sebastian Patane Masuelli

Reputation: 4247

When you set a height as 70%, it will be 70% of the height of its parent element, in this case the table.

So If you use tables out would be forced to give the whole table a height of 100% and then table cell should auto-expand by default.

is this what you mean?

Upvotes: 0

Related Questions