在IE8/FireFox下如何让div内的table垂直居中?[
2009-12-03 18:09
330 查看
<!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垂直居中或居上或居下?
---------------------------------------
1.
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">
----------------------------------------------------
2.
通过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>
-----------------------------------------------
3.
都可以用margin来实现,关于水平靠左靠右可以用:margin:0px auto; align:left 或者 right;
或者在div里面给这个table定义:div { text-align:right 或者 left}
关于table整体垂直居中、靠上、向下,也可以用margin来完成,不过得根据div的高度和table的高度来决定。
<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垂直居中或居上或居下?
---------------------------------------
1.
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">
----------------------------------------------------
2.
通过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>
-----------------------------------------------
3.
都可以用margin来实现,关于水平靠左靠右可以用:margin:0px auto; align:left 或者 right;
或者在div里面给这个table定义:div { text-align:right 或者 left}
关于table整体垂直居中、靠上、向下,也可以用margin来完成,不过得根据div的高度和table的高度来决定。
相关文章推荐
- 兼容IE6,IE7,IE8,Firefox,Chrome,DIV+CSS垂直居中终于失败,最后三分钟用写了几行JS解决,经简单测试,还行。
- DIV实现垂直居中(兼容IE6、IE7、IE8,Firefox)
- bobo如何让div中的内容垂直居中
- DIV实现input垂直居中 兼容IE6和Firefox
- 如何设置图片、文字在容器(div)中垂直居中的显示?
- 未知大小的img或div如何水平垂直居中显示?
- [解决问题] 如何让div中的table居中
- DIV+CSS如何让文字垂直居中
- 如何垂直居中所有浏览器的div?
- 如何将一个div水平垂直居中?4种方法做推荐
- 如何让DIV水平和垂直居中
- 如何让一个div里面的div垂直居中?
- 如何使img或者div在div中水平垂直居中显示
- DIV+CSS如何让文字垂直居中?
- 如何让Div中的Table居中
- jquery如何使得div在频幕上居中,垂直居中
- 如何让DIV水平和垂直居中
- div页面垂直居中,兼容IE、Firefox
- 如何让div水平居中以及垂直居中,在宽高不定的情况下
- 如何让table在body下垂直居中