如何在CSS中更改下拉箭头的位置

不是重复的-请仔细阅读并理解问题。我不想替换箭头。我想保持箭头的原样并更改其位置。appearance:none可以隐藏箭头，通过设置background:url()我可以替换箭头，但这不是我的问题

我有一个下拉列表，看起来不错，可以正常工作。众所周知，默认情况下，它会在下拉列表的右侧添加一个下拉箭头。现在我要做的就是将箭头移到较低的位置margin-top:5px。但是我找不到任何东西pseudo elements或classes无法编写代码。我想仅使用css实现此目的。我发现编写的样式隐藏了元素并添加了另一个元素，但是在我的情况下，我想使图标保持原样并更改位置。

html

<select class="dropdown-select">
   <option value="">Select Location</option>
   <option value="location-1">Location 1</option>
   <option value="location-2">Location 2</option>
   <option value="location-3">Location 3</option>
</select>

的CSS

.dropdown-select{
  outline: none;
  border: none;
}