Javascript 将第二个标题与图像和灯箱居中

我遇到的问题是，我希望“查看更多”链接直接位于每个标题链接的中心。现在它只是被推到了右边，我不知道如何解决这个问题。如果有人知道如何帮助我解决这个问题，那将非常有帮助。我尝试了查看更多链接上的display:block，但什么也没发生，所以我可以使用一些建议。我在这里添加了一个代码笔而不是代码片段，因为lightbox Js非常长。很抱歉给您带来不便。谢谢大家!

---

尝试将项目元素更改为：

<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>

然后，将css中的display:inline块从recentwork a移动到.parentdiv

---

Codepen:

问题在于，您使用外部标记进行样式设置，但在块本身内设置了辅助链接。您可以通过将“查看更多”移动到“标题”的正下方来“立即”修复显示问题，但链接仍然无法工作，因为父链接将覆盖它。您需要在图像之后立即关闭标记以修复该问题，并为每项工作使用一个容器，而不是一个容器。希望一切都有意义！我现在完全明白它为什么不起作用了谢谢你解释得这么好！我对学习css和html的来龙去脉非常陌生，所以当人们乐于帮助而不是屈尊于我的问题时，这总是非常有帮助的。再次感谢@不必客气，祝你设计网站好运@结块

<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>