Question

我遇到的问题是我希望“查看更多”链接直接位于每个标题链接下方。现在它被推向右边，我无法弄清楚如何解决这个问题。如果有人知道如何帮助我解决这个问题，那将是非常有帮助的。我尝试显示：阻止“查看更多”链接但没有任何反应，所以我可以使用一些建议。我在这里添加了一个codepen而不是一个片段，因为灯箱Js超长。很抱歉给您带来不便。谢谢！

http://codepen.io/anon/pen/ggNmYo

<div id="recentwork">
<h2 id="recent"> Most Recent Work</h2>


<a href="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" data-lightbox="website" data-title="">
<img src="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" width="200px" height="200px">
<h3> Title</h3>
</br>
<a href="" class="more"><h3 > See More</h3></a>
</a>


<a href="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" data-lightbox="website" data-title="">
 <img src="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" width="200px" height="200px">
 <h3> Title</h3>
 </br>
  <a href="" class="more"><h3 > See More</h3></a>
 </a>


<a href="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" data-lightbox="website" data-title="">
<img src="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" width="200px" height="200px">
  <h3> Title</h3>
   </br>
   <a href="" class="more"><h3 > See More</h3></a>
</a>


 <a href="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" data-lightbox="website" data-title="">
<img src="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" width="200px" height="200px">
  <h3> Title</h3>
  </br>
    <a href="" class="more"><h3 > See More</h3></a>
  </a>



</div>

Answer 1

尝试将项目元素更改为：

<div class="parentdiv">
<a href="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" data-lightbox="website" data-title="">
<img src="https://upload.wikimedia.org/wikipedia/en/f/f2/Seesmic_Logo.png" width="200px" height="200px">
<h3> Title</h3>
</a>
<a href="" class="more"><h3 > See More</h3></a>
</div>

然后，将{c}中的display: inline-block从#recentwork a移至.parentdiv。

Codepen：http://codepen.io/NotABlueWhale/pen/mRZWrX

以图像和灯箱为中心的第二个标题

1 个答案: