[問題] 如何讓文字切齊底部?
我有個網頁架構長得這樣:
<h4>
<span>一些測試文字一些測試文字一些測試文字一些測試文字</span>
</h4>
我希望達到的效果是,
在 span 的左側會有個 50x40 的小圖案,而 span 的文字底部會跟圖案的底部切齊。
我用了以下的 CSS,可以在 Fx 跟 Opera 運作良好,
就算是多行顯示的 span 文字也能切齊得很好。
h4 {
background: transparent url(http://a.link.to.image.gif) no-repeat scroll
left top;
height: 42px;
display: table;
}
h4 span {
display: table-cell;
vertical-align: bottom;
padding-left: 55px;
}
可是這一招在 IE6 跟 IE7 行不通,不知道有何辦法可以純用 CSS 解決呢?
我無法更動 HTML 架構。
--
╭────────────────────╮
│我的網站改網址了:http://nelson.csie.us/│
│我的網站改網址了:http://nelson.csie.us/│
└────────────────────┘
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.133.134.243
推
04/11 23:02, , 1F
04/11 23:02, 1F
→
04/11 23:02, , 2F
04/11 23:02, 2F
討論串 (同標題文章)
完整討論串 (本文為第 1 之 2 篇):
問題
1
2