Gra*_*ham 5 css image vertical-alignment
好的,所以我有各种解决方案来垂直对齐容器内任意高度的元素.当内容的高度小于容器时,所有这些都有效.
如果内容高度高于容器怎么办？例如,假设我有一个固定高度为100px的容器.我也有一些不同高度的图像; 我需要垂直对齐这些,以便图像的中心点与容器的中心点匹配,如下所示:
(无法上传图片,因为我显然不够信誉) - 例如:http://gbradley.com/_images/stuff/valign.png
如果不手动指定图像的位置,我该如何实现？我觉得我错过了一些非常明显的东西.
如果你不需要IE小于8并且在标准模式下,你可以使用大的负边距和辅助伪元素:http://jsfiddle.net/kizu/CXRVn/
如果你需要更老的IE,你可以使用另一种方式,使用大高度的辅助元素和一些定位怪癖:http://jsfiddle.net/kizu/CXRVn/5/
在那里,您必须将负顶部偏移设置为.image等于辅助器高度的一半减去父级高度的一半.适用于IE6 :)
