如何从 div 顶部对齐文本？

Question

我的文本从 div 顶部对齐有问题。如何使文本从 .txt div 中心对齐？

#content #main #services {
  width: 1010px;
  height: auto;
  min-height: 320px;
  margin: 50px auto;
}

#content #main #services .langelis {
  width: 510px;
  height: auto;
  min-height: 140px;
  position: relative;
  border: 1px #000 solid;
}

#content #main #services .langelis .icon {
  width: 65px;
  min-height: 140px;
  height: auto;
  float: left;
  border: 1px #000 solid;
}

#content #main #services .langelis .txt {
  width: 440px;
  height: auto;
  float: left;
  border: 1px #000 solid;
}

<div id="services">
  <div class="langelis">
    <div class="icon">
      <img src="images/knyg.jpg" alt="knyga" />
    </div>

    <div class="txt">
      <h1>Lorem Ipsum</h1>
      <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s..</p>
    </div>
  </div>

  <div class="clear"></div>
</div>

Answer 1

嗯 首先你需要修复你的 css 选择器。
你不能用这种方式写出所有这些 id。

#content #main #services

只需选择 1 个元素及其子元素。
例如，如果您测试它，它将与您一起工作：

#services .langelis .txt {
width: 440px;
height: auto;
float: left;
border: 1px #000 solid;
text-align:center;

}

如果你想要它垂直对齐 .txt div 的中心，你可以这样做：

#services {
  width: 1010px;
  height: auto;
  min-height: 320px;
  margin: 50px auto;
}

#content #main #services .langelis {
  width: 510px;
  height: auto;
  min-height: 140px;
  position: relative;
  border: 1px #000 solid;
}

#content #main #services .langelis .icon {
  width: 65px;
  min-height: 140px;
  height: auto;
  float: left;
  border: 1px #000 solid;
}

#services .txt {
  width: 440px;
  height: 500px;
  border: 1px #000 solid;
  display: table;
  text-align: center;
}

.sub {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

<div id="services">
  <div class="langelis">
    <div class="icon">
      <img src="images/knyg.jpg" alt="knyga" />
    </div>

    <div class="txt">
      <div class="sub">
        <h1>Lorem Ipsum</h1>
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s..</p>
      </div>
    </div>
  </div>
  
  <div class="clear"></div>
</div>