为什么混合内容的单元格不是顶部对齐? [英] Why cell with mixed content is not top aligned?
问题描述
在最近的问题(为什么只有部分单元格是顶部对齐的?)我问过类似的问题。
当我将其解决方案应用到我的网站时...我还有另一个问题:
< html>
< head>
< style>
table.t_group {
border:2px solid black;
margin:0 auto 0 auto;
}
table.t_group> tbody> tr> td,
table.t_group> tbody> tr> td> img,
table.t_group> tbody> tr> td> a {
vertical-align:top;
}
< / style>
< / head>
< body>
< table class =t_groupstyle =width:500px>
< tbody>
< td>
< img height =24widht =24/>第一个单元
< / td>
< td>
< a>< img height =24widht =24/>< / a>
< a> HREF_text1< / a> (正规文字,< a> HREF_text2< / a>)
< / td>
< td>
最后一个单元格
< / td>
< / tr>
< / tbody>
< / table>
< body>
< / html>
中间单元格包含Regular文本,它仍然与底部对齐。
为什么?如何解决?
还请推荐在这里阅读更多的事情。
我看到的解决方案:
$ b p>
table img {
vertical-align:top;
}
会工作,但是为什么?不明白如何
表img与我的table.t_group> tbody> tr> td> img不同
在无暇阅读的帮助下 https:/ /css-tricks.com/child-and-sibling-selectors/ 我遇到了问题。
我需要的是添加另一个内部阶段 :
table.t_group> tbody> tr> td> a> img
。
谢谢大家!
In the recent question (Why only part of cell is top aligned?) I asked similar question.
When I applied its solution to my web site... I still have another problem:
<html>
<head>
<style>
table.t_group {
border: 2px solid black;
margin: 0 auto 0 auto;
}
table.t_group > tbody > tr > td,
table.t_group > tbody > tr > td > img,
table.t_group > tbody > tr > td > a {
vertical-align: top;
}
</style>
</head>
<body>
<table class="t_group" style="width:500px">
<tbody>
<tr>
<td>
<img height="24" widht="24"/> First cell
</td>
<td>
<a><img height="24" widht="24"/></a>
<a>HREF_text1</a> (regular text, <a>HREF_text2</a>)
</td>
<td>
Last cell
</td>
</tr>
</tbody>
</table>
<body>
</html>
The middle cell contains "Regular" text which is still aligned to the bottom.
Why? How To fix?
P.S. Please also recommend where to read more on this matter. I fell damn asking these type of questions.
EDITED:
I see that solution to do:
table img{
vertical-align:top;
}
would work,... but why? Don't understand how
table img is different from my table.t_group > tbody > tr > td > img
With help of nevermind reading https://css-tricks.com/child-and-sibling-selectors/ I got the problem.
What I needed is to add another 'internal stage':
table.t_group > tbody > tr > td > a > img
Or apply just "table img".
Thanks all!
这篇关于为什么混合内容的单元格不是顶部对齐?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!