xs bootstrap code example

Example 1: col offset in bootstrap

.col-md-3 .offset-md-3

Example 2: how to support xs in bootstrap 4

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

Example 3: Bootstrap 4 Grid

<!-- Control the column width, and how they should appear on different devices -->
<div class="row">
  <div class="col-*-*"></div>
  <div class="col-*-*"></div>
</div>
<div class="row">
  <div class="col-*-*"></div>
  <div class="col-*-*"></div>
  <div class="col-*-*"></div>
</div>

<!-- Or let Bootstrap automatically handle the layout -->
<div class="row">
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
</div>

Example 4: bootstrap grid class

col-12 col-sm-4 col-md-3 col-lg-12	col-xl-12

Example 5: .row bootstrap

.row{
    display: flex;
    flex-wrap: wrap;
	margin-right: -15px;
    margin-left: -15px;
}

Example 6: offset bootstrap

$grid-breakpoints: (
  xs: 0,
  sm: 480px,
  md: 768px,
  lg: 1024px
);

$container-max-widths: (
  sm: 420px,
  md: 720px,
  lg: 960px
);