作者virgin7 (人類造不出天堂)
看板Web_Design
標題[問題] display:table-cell的問題(置中相關)
時間Mon Oct 29 15:49:00 2012
大家午安啊
請教前輩們一個問題
我在div裡又包了兩個div
兩個小div中的內容,都必須上下置中
但 display:table-cell;
vertical-align:middle;
這個能上下置中的code,同時放在兩個小div會有問題
本來可以用別的置中方法
但都已上線,客戶才突然要改,只能從這個方法去修正了....
檔案在此,只有一個小小的html檔
https://secure.soscollaborate.com/shared/=EUBFy5aNrgh-Zg==
懶得下載可以看下面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.pdtDiv{
width:218px;
height:250px;
background-color:#0099FF;
}
.pdtPic{
width:200px;
height:149px;
background-color:#00CC00;
}
.pdtName{
width:200px;
height:90px;
background-color:#FF6600;
}
</style>
</head>
<body>
<div class="pdtDiv">
<div class="pdtPic"><a href="#">sdfjljlsaf 500嘻哈嘻哈哈嘻
哈哈嘻哈哈嘻哈哈嘻哈哈嘻哈哈嘻哈哈哈</a></div>
<div class="pdtName"><a href="#">sdfjljlsaf 500嘻哈嘻哈哈
嘻哈哈嘻哈哈嘻哈哈嘻哈哈嘻哈哈嘻哈哈哈</a></div>
</div>
</body>
</html>
以上,麻煩高人指點..Orz
謝謝~
--
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.136.64.238
→ Rplus:不過中間塞個空白元素似乎就沒事了 10/29 22:21
→ virgin7:在IE似乎是沒效的,不過還是非常感謝~ 10/29 23:48
推 s25g5d4:table-cell在IE下支援性不好 後來我改用inline-block 10/30 21:26
推 s25g5d4:不過你還有垂直置中的需求...這篇文章你看看 10/30 21:29
→ virgin7:謝謝S兄,我再看看~感恩^^ 10/31 14:10