Question

我有一个固定高度的下拉列表，显示多个项目。我的下拉看起来像这样

Item 1          >>
Item 2          >>
Item 3          >>

当有很多项目时会有一个滚动条。有没有办法定位'＆gt;＆gt;'相对于该滚动条的符号？所以它之间有一些填充。我尝试过相对定位，但它似乎没有考虑到滚动条。 css看起来像下面的

.item {
 display:inline-block;
 width:75%    
}

.symbol {
 display:inline-block;
 position: relative;
 right:5px;
}

markup:

<div>
   <div class="item">Item 1</div><div class="symbol">&raquo;</div>
   <div class="item">Item 2</div><div class="symbol">&raquo;</div>
<div>

基本上我想要的是'＆gt;＆gt;'当滚动条存在或不存在时，右边有一些填充的符号。谢谢！

Answer 1

如何为.symbol提供明确的宽度，例如.item，然后使用text-align将其保持在右侧：

.symbol {

  display:inline-block;
  width:25%;
  position: relative;
  right:10px;
  text-align:right;

}

就像这个fiddle ...

一样

相对于垂直滚动条的位置项

1 个答案: