分隔向右浮动的两个url

你有几个选择。。。

• 如你所说,你可以使用 br 将插入换行符
• 你也可以使用 width: 100%; 这将使每个元素成为其父元素的全宽,将两个链接放在单独的行上。使用此方法,您可能希望将父容器推到右侧浮动,或者只需使用 text-align: right; 而不是 float
• clear: both; 也可以通过阻止元素在其旁边浮动来完成这项工作。

不管怎样,结果都是一样的!

另一方面,div对于您的示例来说是不必要的(除非您对它们应用了一些尚未共享的css),所以如果您不将它们用于任何事情,我将删除它们。

a {
  clear: both;
}

<div>
  <div>
    <a style="float: right;" href="/edit/1">Edit</a>
  </div>
  <div>
    <a style="float: right;" href="/delete/1">Delete</a>
  </div>
</div>

设置锚的父元素的样式以将其放置在所需的位置,并为每个锚标记赋予 display: block :

.menu {
  text-align: right
}

.menu__anchor {
  display: block
}

<div class="menu">
  <a class="menu__anchor" href="/edit/1">Edit</a>
  <a class="menu__anchor" href="/delete/1">Delete</a>
</div>

将这些属性添加到 a 元素:

display: flex;
flex-direction: column;

另一种变体是 display: block 致 一 元素。

另一个选择是使用 display:flex 这样地:

    .flexbox {
     display:flex;
     flex-direction: column;
     align-items: flex-end;
    }

  <div class="flexbox">
        <div>
            <a href="/edit/1">Edit</a>
        </div>
        <div>
            <a href="/delete/1">Delete</a>
        </div>
   </div>