Bootstrap选择位置显示刻度

时间:2016-11-25 17:00:56

标签: jquery html css twitter-bootstrap dropdown

是否有可能在右侧显示勾号? 我正在尝试编辑我的CSS代码没有任何变化!只有我的下拉菜单中的选项,如下所示:

  

的CSS

.dropdown-menu {
 position: relative;
 top: 100%;
 right: 0;
 z-index: 1000;
 display: none;
 float: right;
 min-width: 160px;
 padding: 5px 0;
 margin: 2px 0 0;
 list-style: none;
 font-size: 14px;
 background-color: #fff;
 border: 1px solid #ccc;
 border: 1px solid rgba(0,0,0,.15);
 border-radius: 3px;
 -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
 box-shadow: 0 6px 12px rgba(0,0,0,.175);
 background-clip: padding-box;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
 margin-left:10px;
}
  

HTML

<div class="row">
        <div class="form-group col-sm-8 col-md-6 col-lg-4">
            <label>Sistemas Operacionais</label>
                <asp:DropDownList ID="ddlSistemaOperacional" runat="server" onchange="carregarAbas()" CssClass="form-control" multiple data-live-search="true">
                </asp:DropDownList>
                <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="*" Text="*"
                    EnableClientScript="true" ClientValidationFunction="validaSistemaOperacional" ValidationGroup="1"
                    ValidateEmptyText="true" Display="Dynamic" CssClass="text-error" ForeColor="">Campo obrigatório</asp:CustomValidator>
    </div>
</div>

刻度显示在文本的左侧。我想在文本的右侧显示刻度!任何人吗?

1 个答案:

答案 0 :(得分:0)

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 3px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  background-clip: padding-box;
  -webkit-background-clip: padding-box;
}
.bootstrap-select.btn-group .dropdown-menu li {
  position: relative;
}
.dropdown-menu>li>a {
  display: block;
  padding: 3px 20px;
  clear: both;
  white-space: nowrap;
}
.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
  margin-left: 10px;
}
.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
  position: absolute;
  display: inline-block;
  right: 15px;
  margin-top: 5px;
}