CSS Div Inline-Block垂直对齐顶部

Question

我有div，显示是内联块（CSS）。

＆＃13;

＆＃13;

    #content {
      position: absolute;
      width: 950px;
      margin-top: 10px;
      margin-left: auto;
      margin-right: auto;
      left: 0;
      right: 0;
    }
    #content .post_box {
      display: inline-block;
      width: 300px;
      border: 1px solid #dddddd;
      vertical-align: top;
      margin-bottom: 10px;
    }
    #content .post_box img {
      max-width: 100%;
    }

＆＃13;

<div id="content">
  <div class="post_box">
    a
  </div>

  <div class="post_box">
    <img src="https://pbs.twimg.com/media/CdRFUqRVAAAtREu.jpg" />
  </div>

  <div class="post_box">
    c
  </div>

  <div class="post_box">
    d
    <br>d
  </div>

  <div class="post_box">
    e
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

以下是演示：

http://175.111.116.69/kongkow.co/

我想要＆＃34; d＆＃34;正好在＆＃34; a＆＃34;。所以＆＃34; d＆＃34;将是该图像的左侧。

如何修复该代码？

Answer 1

这可能会帮助你

 <div id="content">
  <div class="post_box">
      <div class="post_box">
        a
     </div>
     <div class="post_box">
        d<br>d
     </div>
     <div class="post_box">
        e
     </div>
  </div>

     <div class="post_box">
        <img src=""/>
    </div>
  <div class="post_box">
    <div class="post_box">
        c
    </div>
  </div>
</div>