html - 在表单搜索中结合 input-prepend 和 input-append

Question

我正在使用 bootstrap 来设计我的网站。

我注意到在执行此操作时:

 <form class="form-search  navbar-search pull-right">
                <div class="input-append input-prepend">
                    <span class="add-on"><i class="icon-search"></i></span>
                    <input id="searchQuery" class="search-query" type="search" placeholder="Rechercher" />
                    <a class="btn add-on" href="#">Rechercher</a>
                </div>

输入文本框在左侧仍然是圆形的。查看 css 时不应该是这种情况:

.form-search .input-append .search-query,
.form-search .input-prepend .search-query {
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
      border-radius: 0;

我做错了什么吗？

Answer 1

你的类'.search-query'的问题

构成风格..

.form-search .input-prepend .search-query {
    border-radius: 0 14px 14px 0;
}

删除搜索查询类