// Extra small devices (portrait phones, less than 576px)// No media query for `xs` since this is the default in Bootstrap// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }
// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
<!-----------------------BOOTSTRAPGRIDSYSTEM------------------------>This code will create 4 boxes placed side by side, which will be
dynamically positioned, according to the size of the screen. We define
the following behavior:
<!-- Desktop Display: we have 4 columns per row (each occupies 3 units out of 12) -->class="col-lg-3"<!-- display large with 12/3=4 columns --><!-- Tablet Display: we have 3 columns per row (each occupies 4 units out of 12) -->class="col-md-4"<!-- display medium with 12/4=3 columns --><!-- Mobile Display: we have 2 columns per row (each occupies the 6 units of 12) -->class="col-sm-6"<!-- display small with 12/6=2 columns --><!--CODE--><div class="row"><div class="col-lg-3 col-md-4 col-sm-6" style="background-color:red; border:1px solid black;">
One of four columns
</div><div class="col-lg-3 col-md-4 col-sm-6" style="background-color:yellow; border:1px solid black;">
One of four columns
</div><div class="col-lg-3 col-md-4 col-sm-6" style="background-color:green; border:1px solid black;">
One of four columns
</div><div class="col-lg-3 col-md-4 col-sm-6" style="border:1px solid black;">
One of four columns
</div></div>
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems
resetting your password contact us
Check Your Email and Click on the link sent to your email