垂直中间有桌子

Question

我试图将我的段落与table，table-cell和vertical-align对齐。出于某种原因，它不起作用。请检查我的code。

HTML

<div class="a">
  <img src="http://dummyimage.com/600x400/000/fff" alt="">
  <div class="b">
    <p>sdfsdfsdfsdfsdfs</p>
  </div>
</div>

CSS

.a {
  display: block;
  float: left;
  height: 100%;
  min-height: 1px;
  width: 334px;
  background: red;
}

.a > * {
  float: left;
}

Answer 1

编辑小提琴http://jsfiddle.net/k73xfayx/这里

外部元素必须有display: table，内部元素table-cell

我在你的img（c类）周围放了另一个DIV来获得那个结构：一个围绕DIV（a），两个DIV（c和b），其中一个包含img，一个是带有文本的p-Tag 。

Answer 2

您的代码似乎不包含任何＆lt; table＆gt;标签。 如果我误解了你的问题，我很抱歉。

如果您更改了它，那么您可以编辑您的问题并在其中发布您的代码的先前版本。 这将有助于有类似问题的人。

这是我目前看到的：

<div class="a">
  <img src="http://dummyimage.com/600x400/000/fff" alt="">
  <div class="b">
    <p>sdfsdfsdfsdfsdfs</p>
  </div>
</div>

样式：

.a {
  display: block;
  float: left;
  height: 100%;
  min-height: 1px;
  width: 334px;
  background: red;
}

.a > * {
  float: left;
}