Member Avatar for karthik_ppts

Can we use 'min-height' property in <table> tag? I used but its not working any suggestion?

  • 2 Contributors
  • 3 Replies
  • 122 Views
  • 6 Days Discussion Span
  • Latest Post Latest Post by karthik_ppts

Dani AI

Generated

min-height is a valid CSS property, but HTML tables use the browser’s table layout rules so min-height on a <table> (or on rows) can behave differently from block elements. ran into that and pointed to a demo — browsers may compute table/row/cell heights from content and the table algorithm rather than from min-height directly. See the spec and reference notes on the property: MDN — min-height and W3C — CSS 2.1: Tables.

Practical, cross-browser options:

  • Keep the table as-is and put it inside a block-level wrapper; apply min-height to that wrapper (robust and what ultimately used).
  • Put a block-level element inside the cell and apply min-height to that inner element. That forces the visible cell height without changing table layout.
  • If the element is only being used for layout (not tabular data), change display to block so min-height behaves like a normal block, but be aware you lose native table behavior.

Example (inner element approach):

<td>
  <div class="cell-inner">cell content</div>
</td>

.cell-inner {
  min-height: 120px;
  box-sizing: border-box;
}

Troubleshooting tips: inspect the computed height in DevTools to see which rule wins; check that height or max-height aren’t overriding min-height; ensure a standards DOCTYPE (quirks mode changes layout); and remember old IE had min-height quirks — the wrapper/inner-div approach is the safest for consistent results.

Recommended Answers

All 3 Replies

Member Avatar for karthik_ppts

for <div> Its working perfectly. So i placed my table inside a <div> and </div> and set the min-height to <div>. problem solved.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.