vertical-align属性不适用于谷歌浏览器
[英]vertical-align property not working on google chrome
问题描述
<html>
<head>
<style>
table,td {border:1px solid black ;}
table {width : 80% ;height:80%;}
.top {vertical-align:top};
.center {vertical-align: middle};
.bottom {vertical-align: bottom};
</style>
</head>
<body>
<table>
<tbody>
<tr><td class = "top">1</td><td class = "top" "left">2</td><td class = "top" "left">3</td></tr>
<tr><td class = "center" >4</td><td class = "center">5</td><td class = "center">6</td></tr>
<tr><td class = "bottom">7</td><td class = "bottom">8</td><td class = "bottom">9</td></tr>
</tbody>
</table>
</body>
</html>
Line number 8 ie .bottom {vertical-align: bottom}; 
第8行，即.bottom {vertical-align: bottom}; is working perfectly fine in internet explorer 8 but it does not work on google chrome even though i have the latest version. 在Internet Explorer 8中工作得非常好，但即使我有最新版本，它也不适用于谷歌浏览器。
1 个解决方案
解决方案1
5 2016-06-26 19:42:08
I think you had a simple syntax issue, the semi-colons should be inside the closing bracket. 我认为你有一个简单的语法问题，分号应该在结束括号内。
See your code below. 请参阅下面的代码。
Also, add height: 100% to body and html to set the reference for the table-cell heights. 另外，将body height: 100%添加到body和html以设置table-cell高度的引用。
Note: As noted in one of the posted comments, you did not define a CSS style for left , so it was not clear what you intended. 注意：正如其中一篇发表的评论中所述，您没有为left定义CSS样式，因此不清楚您的意图。 By itself, left is not a valid attribute. 就其本身而言， left不是有效属性。
body, html { height: 100%; } table, td { border: 1px solid black; } table { width: 80%; height: 80%; } .top { vertical-align: top; } .center { vertical-align: middle; } .bottom { vertical-align: bottom; }
<table> <tbody> <tr> <td class="top">1</td> <td class="top">2</td> <td class="top">3</td> </tr> <tr> <td class="center">4</td> <td class="center">5</td> <td class="center">6</td> </tr> <tr> <td class="bottom">7</td> <td class="bottom">8</td> <td class="bottom">9</td> </tr> </tbody> </table>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.