CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Andrei P
Andrei P

Reputation: 309

bootstrap form while mobile

I'm using a form for the site search with a button inside the text-box. On the desktop version it works ok, howerver when resizing to mobile it is not. I am using a position: absolute; to set the button positioning, giving it a fixed position. Is there any way I can make this work on the mobile version as well?

HTML:

    <!-- Right search form -->
    <div class="col-md-3 col-xs-12">
      <form class="form-inline" role="search">
        <div class="form-group">
          <input type="text" class="form-control search-input" size="40" placeholder="Cauta in site...">
          <input type="submit" value="" class="search-button" id="searchsubmit">
        </div>
      </form>
    </div>

CSS:

.search-button {
background: url('../images/search-btn.png') right no-repeat;
border: 0px solid black;
border-left: none;
cursor: pointer;
height: 35px;
width: 35px;
position:absolute;
left:241px;
top: 3px;
}

Upvotes: 0

Views: 57

Answers (1)

Jean-philippe Emond
Jean-philippe Emond

Reputation: 1614

you can use the bootstrap class reference here

 <div class="input-group">
  <span class="input-group-btn">
    <button class="btn btn-default" type="button">Go!</button>
  </span>
  <input type="text" placeholder="Cauta in site..." class="form-control">
</div><!-- /input-group -->

Upvotes: 2

Related Questions