Avatar of matiascx
matiascx
Flag for China asked on

how to force table has a min-height even if no tr in the tbody?

Hi, experts,
I have a requirement of css layout:
Even if no table data, we must make sure the table at least occupy some height place.
How to let that happen?
I have created one plunker, any help is appreciated, thanks!
http://plnkr.co/edit/OuicJDoWoWANNdCfKrD2?p=preview
<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
    <style>
      .box{
        height: 100px;
        width:  100px;
        background: blue;
      }  
      .noconent{
        height: 500px;
        background: red;
      }
    </style>

  </head>
  <body>
    <table>
      <thead>
        <tr>
          <td>col1</td>
          <td>col2</td>
          <td>col3</td>
        </tr>
      </thead>
      <tbody class="nocontent">
        &nbsp;
      </tbody>
    </table>
  </body>

</html>

Open in new window

CSSWeb Languages and StandardsWeb Development

Avatar of undefined
Last Comment
matiascx

8/22/2022 - Mon
ASKER CERTIFIED SOLUTION
Russ Suter

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
matiascx

ASKER
Exactly what i need.
Thank you~!
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck