html - href 之间的空间

Question

我有这个 div。

 <div class="abc">
    <a href="#">Select All</a>
     <a href="#">#</a>
    {{#each letters}}
        <a href="#">{{this}}</a>
    {{/each}}
 </div>

打印出来的是这样的:

但我想得到这样的东西:

忽略星形图标。

我想在每个字母之间留出空格并改变 href 的颜色

已经尝试过

margin-left: 1.375rem;

但是没有用。

Answer 1

只需使用 display: inline-block;在<a>并设置你的 margin或 padding

CSS

a{
    display: inline-block;
    margin-right: 10px; //Adjust your needs
}

DEMO HERE