CSS高度80％不起作用 [英] css height 80% not working
本文介绍了CSS高度80％不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想让我的桌子占据屏幕的80％，但现在它只占桌子上内容的大小.
I want to make my table take up 80% of the screen, but right now its only the size of the content in the table.
#ecom-mainarea .center
{
margin-left: 10%;
position: relative;
width: 80%;
height: 80%; /* when this is 500px it works fine, but % doesn't work */
border: 1px solid;
border-bottom-color: teal;
border-top-color: gray;
border-left-color: gray;
border-right-color: teal;
background-color: white;
voice-family: "\"}\"";
voice-family: inherit;
vertical-align: text-top;
}
推荐答案
您需要确保 html 和 body 元素的 100％高度.他们需要从上到下伸展.如果不是，则 html 和 body 元素将与表一样高.
You need to make sure that the htmland body elements have 100% height. They need to stretch from top to bottom. If not the html and body element will just be as high as your table.
这里有一个有效的示例:
Here you have a working sample:
<!doctype html>
<html>
<head>
<title>Table height</title>
<style>
html, body
{
padding: 0;
margin: 0;
height: 100%;
}
</style>
</head>
<body>
<table style="background: cyan; height: 80%;">
<tr>
<td>
Table has 80% of the height of the body
</td>
</tr>
</table>
</body>
</html>
这篇关于CSS高度80％不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
