小编And*_*Tat的帖子

假设您有一个带有Jekyll的博客站点,并且博客帖子位于页面的中心.我希望内容(即段落,单词,代码等)与左对齐,但图像要居中.

我有文本等左对齐,但现在我正在努力使图像(谁具有CSS样式max-height: 80%)也在中心.

似乎Jekyll的博客生成器(来自Markdown)将图像包装在<p></p>标签中,因此margin: 0 auto不会使图像居中.我在下面附上了代码片段:

<li>
    <h2 class="post-title">Hello World</h2>
    <div class="post-date"><span>May 21, 2014</span></div>
    <div class="post-content">
        <p><img src="/images/photos/blog/hello-world.jpg" alt="blog-image"></p>
    </div>
</li>

ul#posts {
  list-style-type: none;
  margin: 0 auto;
  width: 60%;
}

ul#posts > li {
  margin-bottom: 35px;
  text-align: center;
}

ul#posts > li div.post-content {
  text-align: left;
}

ul#posts > li > div.post-date {
  color: #A0A0A0;
  font-style: italic;
  margin-bottom: 15px;
}

ul#posts > li > div.post-content > p > img {
  margin: 0 auto; …