div中图文垂直居中显示
用datalist做了一个图文显示列表,就单纯的一个td里面放一张图片和图片名字,在Firefox下能正常显示:
在IE6中看就没有垂直居中了:
datalist中td的代码如下:
<td class="mark dot1" width="100px" height="100px" align="center" valign="middle">
<a onclick='MenuChange3("<%#Eval("NameCh")%>");' style="cursor:pointer;vertical-align:middle;">
<img height="56" width="53" src='<%# "images/car2/"+Eval("Url") %>' />
</a>
<br>
<asp:Label ID="lblname" runat="server" Text='<%# Eval("NameCh") %>'></asp:Label>
</td>
之前也在td的style里面有设置过height和line-height属性,好像也没用,求救高手解答!!!! --------------------编程问答-------------------- 看你内容是什么了
一行文字的话用line-height最方便
图片的话用背景
background-image: url('images/03.gif');
background-repeat: no-repeat;
background-position: 50% 50%; --------------------编程问答--------------------
--------------------编程问答-------------------- 不要auto,用margin-letf:*px.真实值,这样就不怕了。。。 --------------------编程问答-------------------- margin:0px auto 放在对应div里 --------------------编程问答-------------------- 找美工 --------------------编程问答-------------------- 错,是找前端设计师! --------------------编程问答-------------------- 找UI 设置. 就是CSS问题. --------------------编程问答-------------------- Td的高度 和图片一样, 这样就可以了, 如果TD高度大于图片, 那么图片就会往上去, 或者加个margin-top是多少, 也可以控制内容距离顶部多少 --------------------编程问答--------------------
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>多行文字实现垂直居中 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
font-size: 12px;
font-family: tahoma;
}
div#wrap {
display: table;
border: 1px solid #FF0099;
background-color: #FFCCFF;
width: 760px;
height: 400px;
*position: relative;
overflow: hidden;
}
div#subwrap {
vertical-align: middle;
display: table-cell;
*position: absolute;
*top: 50%;
}
div#content {
*position: relative;
*top: -50%;
}
</style>
</head>
<body>
<div id="wrap">
<div id="subwrap">
<div id="content">
<pre>
现在我们要使这段文字垂直居中显示!
div#wrap {
border:1px solid #FF0099;
background-color:#FFCCFF;
width:760px;
height:500px;
position:relative;
}
div#subwrap {
position:absolute;
border:1px solid #000;
top:50%;
}
div#content {
border:1px solid #000;
position:relative;
top:-50%;
}</pre>
</div>
</div>
</div>
</body>
</html>
现在不是垂直方面的问题了,而是水平方向没有居中对齐了... --------------------编程问答-------------------- 哦,好像水平和垂直的都没有对齐... --------------------编程问答-------------------- 检查下里面有没有日企,有的话去掉,多半是这个问题
补充:.NET技术 , ASP.NET