Pages

Showing posts with label Create checkboxes on the same line using bootstrap. Show all posts
Showing posts with label Create checkboxes on the same line using bootstrap. Show all posts

Wednesday, February 18, 2015

deepstutorials:Bootstrap:Create checkboxes on the same line using bootstrap





Inline Checkboxes gives users ability to place all the checkoxes in the same line by using the .checkbox-inline class .

<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
  <h2>Form control: inline checkbox</h2>
    <form role="form">
    <label class="checkbox-inline">
      <input type="checkbox" value="">checkbox 1
    </label>
    <label class="checkbox-inline">
      <input type="checkbox" value="">checkbox 2
    </label>
    <label class="checkbox-inline">
      <input type="checkbox" value="">checkbox 3
    </label>
    <label class="checkbox-inline">
      <input type="checkbox" value="">checkbox 4
    </label>
  </form>
</div>
</body>
</html>