-3

Bootstrap のドロップダウン メニューと組み合わせた入力テキストがあります。次のコードとして input-prepend を使用しました。

<div class="input-prepend">
<div class="btn-group">
    <button id="btn-cat" class="btn" tabindex="-1" name="category">All</button>
    <button class="btn dropdown-toggle" data-toggle="dropdown" tabindex="-1"> <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" id="category-menu">
        <li><a href="#">Computers</a></li>
        <li><a href="#">Cell Phones & Accessories</a></li>
        <li><a href="#">Magazine Subscriptions</a></li>
        <li><a href="#">Video Games</a></li>
        <li><a href="#">Sports & Outdoors</a></li>
    </ul>
</div>
<input type="text">

こちらのデモを参照してください: http://jsfiddle.net/LCdvQ/1/

問題は、長いメニュー項目を選択すると、入力テキストが右に移動することです。私が欲しいのは、amazon.com の検索ボックスのような効果です。

4

1 に答える 1

0

こんなものが欲しい..??

http://jsfiddle.net/LCdvQ/4/

.input-prepend{
    border: 1px solid #ccc;
    width: 500px;
}

.text1{
    border: 0px!important;
}
于 2013-05-16T11:06:29.423 に答える