0

我基本上是在尝试创建一个带有液体的 2 列 div<h1>和另一个跨越整个高度的 div <h1>，但我希望垂直对齐居中。我基本上是在尝试将图像放在页面标题的左侧：

<div class="outer">
   <div><img src="pound.png" /></div>
   <h1>This is text that is really long. This is text that is really long.  This is text that is really long.  This is text that is really long.  This is text that is really long.</h1>
</div>

这是一个例子；我真的不想使用表格，因为我希望能够在某些情况下将图像浮动到右侧。我也不关心边界，我只是为了说明对齐方式。

------------------------------------------------------
        |  This is text that is really long. This is 
######  |  text that is really long. This is text that
######  |  is really long. This is text that is really
######  |  long. This is text that is really long. This 
        |  is text that is really long.
------------------------------------------------------

我的主要问题是让图像垂直占据整个空间，以便我可以使用 margin: 50% 或 auto 或它的一些变体垂直对齐它。我可以让图像垂直居中，然后文本环绕它，或者我可以让文本不换行，但图像垂直对齐。

4

3 回答 3

0

这个主题在网上被广泛讨论：http: //goo.gl/hmTsW

我发现这是一个很好的技术总结，选择适合你的。http://blog.themeforest.net/tutorials/vertical-centering-with-css/

于 2012-04-09T02:01:32.327 回答
0

浏览器支持目前有点有限，但您可以尝试使用box-aligncss 属性来垂直对齐图像和文本。更多在这里。

于 2012-04-09T02:43:13.133 回答
-1

尝试使用行高。此外，如果可能的话，使用差异会更容易

于 2012-04-09T00:05:01.403 回答