Angular Slider-html我需要添加一个左右边距

Question

我正在使用角度滑块http://ngmodules.org/modules/angular-slider.

除了一个例外，一切都正常——我无法使滑块与边距一致。

我的目标是让页面中心的滑块每侧都有大约20%的空白。

<div style="text-align: center;">
 ....
  <div style="margin: 40px 0 60px 0; font-size: 10pt;">
        <div style="width:20px">
       <a style="text-align: left; margin-left: 20%;margin-right: 20%">
        <slider floor="0" ceiling="500" step="50" precision="2" ng-model="cost"></slider>
           </a>
        </div>
 </div>
</div>

Answer 1

不确定它是否有帮助，但您可以尝试设置：

position: relative;
left: 20%;
right: 20%;

Answer 2

我不知道你为什么要这样做并为<a>元素设置样式，但从Angular页面中的代码来看，你应该使用这样的东西：

<ul>
    <li ng-repeat="item in items">
        <p>Name: </p>
        <p>Cost: </p> 
        <slider floor="100" ceiling="1000" step="50" precision="2" ng-model="item.cost"></slider>
    </li>
</ul>

因此，为了适应您的情况：

<div class="container">
<ul>
    <li ng-repeat="item in items">
        <p>Name: </p>
        <p>Cost: </p> 
        <slider floor="100" ceiling="1000" step="50" precision="2" ng-model="item.cost"></slider>
    </li>
</ul>
</div>

现在，CSS就像这样简单：

.container{text-align:center}
ul{width:60%; margin:20px auto} /* adjust vertical margins to your needs */
li{....}

请注意，本例使用了UL和LI的构造，但显然可以使用相同的逻辑将其替换为DIV。不知道你为什么想要A，但试一下，也许它有效，我只是不明白你需要什么，可能需要更多信息。