在IE8/FireFox下如何让div内的table垂直居中？[

最新推荐文章于 2021-02-01 11:04:52 发布

cf_nick

最新推荐文章于 2021-02-01 11:04:52 发布

阅读量7.7k

点赞数

分类专栏： div+css 文章标签： table div ie xhtml html

div+css 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

<title></title>

</head>

<body>
<div style="width:500px;height:500px;background-color:Red;">
<table style="width:100px;height:100px;background-color:Blue;margin:0px auto;">
<tr>
<td>
</td>
</tr>
</table>
</div>
</body>

</html>
---------------------------------------

红色div里有个蓝色table，现在table可以水平居中.请问:
如何让table水平靠右或水平靠左？
如何让table垂直居中或居上或居下?

---------------------------------------

table水平靠左
<table style="width:100px;height:100px;background-color:Blue;margin:0px auto;" align="left">
table水平靠右
<table style="width:100px;height:100px;background-color:Blue;margin:0px auto;" align="right">
----------------------------------------------------

通过DIV控制TABLE--------》这里是正居中
<style type="text/css">
#Frame
{
width:500px;
height:300px;
background-color:#666666;
position:absolute;
left:50%;
top:50%;
margin-left:-250px;
margin-top:-150px;
}
</style>
................
<div id="Frame">
<table>
<table>
<div>

-----------------------------------------------

都可以用margin来实现，关于水平靠左靠右可以用：margin:0px auto; align:left 或者 right;
或者在div里面给这个table定义：div { text-align:right 或者 left}

关于table整体垂直居中、靠上、向下，也可以用margin来完成，不过得根据div的高度和table的高度来决定。