如何使用CSS在内联块元素之间添加换行符？

Question

我有图像列表.我想在使用CSS的第二个图像之后放置一个换行符.我使用了下面列出的CSS技巧,但它不适用于内联块元素.它仅适用于显示内联元素

适用于内联元素的代码.

HTML

<div>
    <a href="#">Dummy Link</a>
    <a href="#">Dummy Link</a>
    <a href="#">Dummy Link</a>
    <a href="#">Dummy Link</a>
</div>
<div>
    <img src="http://placehold.it/50X50" />
    <img src="http://placehold.it/50X50" />
    <img src="http://placehold.it/50X50" />
    <img src="http://placehold.it/50X50" />
</div>

CSS

a:nth-of-type(2):after
{
    white-space: pre;content:'\A';
}
img:nth-of-type(2):after
{
    white-space: pre;content:'\A';
} 

如果我使用img元素,默认显示为:inine-block.上面的CSS不起作用.

例如,检查下面的小提琴

http://jsfiddle.net/murli2308/dD52z/1/

如果有任何办法,请告诉我

注意 - 我无法更改HTML结构,因为它来自数据库.

Answer 1

a:nth-of-type(2), img:nth-of-type(2) {
  display: block;
}