CODEWITHSUNDEEP
twitter-bootstrap
iefpw
iefpw

Reputation: 7052

Increase navbar text input length

The default "search box" in the navbar is:

<form class="navbar-form navbar-left" role="search">
  <div class="form-group">
    <input type="text" class="form-control" placeholder="Search">
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>

I'm trying to increase the length of the input horizontally so I can see and type more text.

How can I increase the length of the text box?

Upvotes: 0

Views: 1318

Answers (2)

OdraEncoded
OdraEncoded

Reputation: 3134

You can change the CSS attribute width or use the HTML attribute size.

CSS example: should make the elements with the search-class-here class 400px wide

.search-class-here { width: 400px; }

HTML example: should make the textbox around 40 characters in width.

<input type="text" size="40">

Upvotes: 0

Yasser-Farag
Yasser-Farag

Reputation: 582

add this class to the current css class of the input text box

<form class="navbar-form navbar-left" role="search">
  <div class="form-group">
    <input type="text" class="form-control span10" placeholder="Search">
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>

I add span10, you can add span4, span5, span6 ...... depends on the length you want

Upvotes: 1

Related Questions