Why Are My Bootstrap XS Columns Not Wrapping on Small Screens?

Bootstrap XS Columns Wrapping Issue

Question:

Small screen XS columns in Bootstrap aren't wrapping as expected when adding up to 12 units and decreasing screen width.

Answer:

Bootstrap has a known issue regarding this behavior. On very small screens (less than 360px), the col-xs-1 columns start to wrap prematurely due to a mismatch between column width and padding.

This can be avoided by avoiding col-xs-1 on extremely small screens. Consider if the screen size will realistically be resized below 360px. In many cases, it won't.

Note for Bootstrap 4:

Col-xs-1 has been renamed to col-1 in Bootstrap 4.

Related Issue:

• Bootstrap grid breaks in smallest size

The above is the detailed content of Why Are My Bootstrap XS Columns Not Wrapping on Small Screens?. For more information, please follow other related articles on the PHP Chinese website!