Guest User

Untitled

a guest
Mar 13th, 2018
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.69 KB | None | 0 0
  1. <div class="container">
  2. <div class="row justify-content-center align-items-center">
  3. <form>
  4. <div class="form-group">
  5. <label for="formGroupExampleInput">Example label</label>
  6. <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
  7. </div>
  8. <div class="form-group">
  9. <label for="formGroupExampleInput2">Another label</label>
  10. <input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input">
  11. </div>
  12. </form>
  13. </div>
  14. </div>
  15.  
  16. <div class="container h-100">
  17. <div class="row h-100 justify-content-center align-items-center">
  18. <form class="col-12">
  19. <div class="form-group">
  20. <label for="formGroupExampleInput">Example label</label>
  21. <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
  22. </div>
  23. <div class="form-group">
  24. <label for="formGroupExampleInput2">Another label</label>
  25. <input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input">
  26. </div>
  27. </form>
  28. </div>
  29. </div>
  30.  
  31. html, body {
  32. height: 100%;
  33. }
  34. .container, .row.justify-content-center.align-items-center {
  35. height: 100%;
  36. min-height: 100%;
  37. }
  38.  
  39. <section class="h-100">
  40. <header class="container h-100">
  41. <div class="d-flex align-items-center justify-content-center h-100">
  42. <div class="d-flex flex-column">
  43. <h1 class="text align-self-center p-2">item 1</h1>
  44. <h4 class="text align-self-center p-2">item 2</h4>
  45. <button class="btn btn-danger align-self-center p-2" type="button" name="button">item 3</button>
  46. </div>
  47. </div>
  48. </header>
  49. </section>
Add Comment
Please, Sign In to add comment