In the previous chapter, we presented a grid example with classes for small and medium devices. We used two divs (columns) and we gave them a 25%/75% split on small devices, and a 50%/50% split on medium devices:
But on large devices the design may be better as a 33%/66% split.
Tip: Large devices are defined as having a screen width from 1200 pixels and above.
For large devices we will use the .col-lg-* classes.
So now we will add the column widths for large devices:
Now Bootstrap is going to say "at the small size, look at classes with -sm- in them and use those. At the medium size, look at classes with -md- in them and use those. At the large size, look at classes with the word -lg- in them and use those".
The following example will result in a 25%/75% split on small devices, a 50%/50% split on medium devices, and a 33%/66% split on large devices:
 |
Note: Make sure that the sum always adds up to 12. |
|---|
Your message has been sent to W3Schools.