更改搜索框的宽度和高度

时间:2014-05-09 19:31:51

标签: html css twitter-bootstrap search-box

搜索框在栏上的宽度方面太小(使用栏而不是导航栏以进行自定义)。如何使搜索栏更宽广?另外,如何更改搜索框的高度?相对于屏幕的顶部?

<div  class="bar navbar-inverse navbar-fixed-top">
    <div class="container">
        <span id="logo">  
            <a href="main.php">XYZ</a>
        </span>
        <span  class="col-xs-5 right-inner-addon has-feedback">
               <form class="form-inline" role="form">
                 <div class="form-group has-feedback">
                 <label class="control-label" for="inputSuccess4"></label>
                 <input type="text" class="form-control" id="inputSuccess4">
                 <span class="glyphicon glyphicon-search form-control-feedback"></span>
                 </div>
               </form>             
        </span>
    </div>   
</div>

    .right-inner-addon {
        padding-top: 5px;
        padding-left:30px;
        position: relative;
    }
    .right-inner-addon input {
    width: 500px;
    height: 30px;
    padding: 0px 5px;
}
    .right-inner-addon i {
        position: absolute;
        right: 0px;
        padding: 10px 6px;
        pointer-events: none;
    }

1 个答案:

答案 0 :(得分:0)

form-control添加width= *insert width here*的样式中。这应该工作