How To Make A Div Inside Table Td With Height 100%? - Lime Brains

Trang chủ » Html Fill Table Cell With Div » How To Make A Div Inside Table Td With Height 100%? - Lime Brains

Có thể bạn quan tâm

How to make a div inside table td with height 100%?Problem 😱

Let’s say we have a following html table:

<table style="height: 1px;"> <tbody> <tr> <td class="full-height"> <div class="full-height" style="background: red;"> height 100% </div> </td> <td> 1<br/> 2<br/> 3<br/> </td> </tr> </tbody> </table>

with css:

.full-height { height: 100%; }

Result:

Initial

We want the red part to have a full height of the row but height: 100% on div and td is not enough.

Solution 🤓

🎉 🎉 🎉 more css 🎉 🎉 🎉

table { height: 1px; }

Result:

Result

Confirmed to work on Chrome, Firefox and Safari.

Why 1px? No idea.

Your companyyour websiteLet's talk about your big idea?Wanna join?your new titleJoin us!

Từ khóa » Html Fill Table Cell With Div