Bootstrap 3 Skeleton

This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.

by silb3r

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="container">
  <div class="row">
    <div class="col-xs-4 col-xs-offset-4">
      <div class="col-inner">
        <p><-- Full width "inline" form fits its container --></p>
        <form role="search" method="get" class="search-form">
          <label class="sr-only">Search</label>
          <div class="input-group full-width">
            <input type="search" name="s" class="search-field form-control" placeholder="Search">
            <span class="input-group-btn">
              <button type="submit" class="search-submit btn btn-default">Search</button>
            </span>
          </div>
        </form>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-6 col-xs-offset-3">
      <div class="col-inner">
        <p><-- Full width "inline" form fits its container --></p>
        <form role="search" method="get" class="search-form">
          <label class="sr-only">Search</label>
          <div class="input-group full-width">
            <input type="search" name="s" class="search-field form-control" placeholder="Search">
            <span class="input-group-btn">
              <button type="submit" class="search-submit btn btn-default">Search</button>
            </span>
          </div>
        </form>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-8 col-xs-offset-2">
      <div class="col-inner">
        <p><-- Full width "inline" form fits its container --></p>
        <form role="search" method="get" class="search-form">
          <label class="sr-only">Search</label>
          <div class="input-group full-width">
            <input type="search" name="s" class="search-field form-control" placeholder="Search">
            <span class="input-group-btn">
              <button type="submit" class="search-submit btn btn-default">Search</button>
            </span>
          </div>
        </form>
 ...

CSS

@import url('http://getbootstrap.com/dist/css/bootstrap.css');
.input-group.full-width .input-group-btn:last-child > .btn {
  margin-left: 5px;
}
.input-group.full-width .input-group-btn:last-child > .btn {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
}
.input-group.full-width .form-control:first-child {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
}

/*
 * Bootstrap LESS
 *
 * Adjust margin-left as needed
 *
 *

.input-group.full-width {
	.input-group-btn:last-child > .btn {
		margin-left: 5px;
		.border-left-radius(@border-radius-base);
	}
	.form-control:first-child {
		.border-right-radius(@border-radius-base);
	}
}

*/

/* Stlying below is not required; for demo purposes only */

.row {
  margin-bottom: 15px;
}
.col-inner {
  border: 1px solid red;
}
p {
  text-align: center;
}