0

Webサイトのスタイリングにブートストラップを使用しています。

私はこれを行うときに気づきました：

 <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;

}

私は何か間違ったことをしていますか？

4

2 に答える 2

1

次の方法でフォームを作成できます。

Jsfiddle デモ

<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" type="search" placeholder="Rechercher" /> <div class="btn-group">
            <button  class="btn">Rechercher</button>

          </div>

  </form>

それらにはすでに境界半径 0 が定義されているため、境界半径 0 を設定するための入力にアタッチする追加のクラスは必要ありません。

.input-prepend.input-append input, .input-prepend.input-append select, .input-prepend.input-append .uneditable-input {

border-radius: 0 0 0 0;

   }
于 2013-03-06T09:28:56.907 に答える