Bootstrap 4 Beta: The Removal and Restoration of Column Offsetting
Bootstrap 4, in its Beta 1 release, introduced significant changes to the way columns were offset. However, with the subsequent release of Beta 2, these changes have been reversed.
From offset-md-* to ml-auto
In Bootstrap 4 Beta 1, the offset-md-* classes were removed. Instead, developers were encouraged to use the .ml-auto class to offset columns. However, this method did not provide the same level of precision as the previous approach.
Restoring Offset Classes in Beta 2
Fortunately, in Beta 2, the offset classes have been restored. The new syntax uses the format offset-{breakpoint}-, replacing the previous col-{breakpoint}-offset- syntax.
Custom Offsetting
To achieve custom column offsets, such as the now-deprecated <div>
Using Dummy Placeholders
<pre>
<div>
<div>
</div>
</pre>
Using ml-auto and mr-auto
To center two adjacent columns, developers can apply ml-auto and mr-auto to both columns.
<pre>
<div>
<div>
</div>
</pre>
Using mx-auto
To center a single column, developers can use mx-auto to create equal margins on both sides.
Conclusion
The removal and restoration of column offsets in Bootstrap 4 has created some temporary confusion for developers. However, with the reintroduction of specific offset classes in Beta 2, along with the availability of workaround methods, developers can continue to achieve custom column layouts in Bootstrap 4.
अस्वीकरण: उपलब्ध कराए गए सभी संसाधन आंशिक रूप से इंटरनेट से हैं। यदि आपके कॉपीराइट या अन्य अधिकारों और हितों का कोई उल्लंघन होता है, तो कृपया विस्तृत कारण बताएं और कॉपीराइट या अधिकारों और हितों का प्रमाण प्रदान करें और फिर इसे ईमेल पर भेजें: [email protected] हम इसे आपके लिए यथाशीघ्र संभालेंगे।
Copyright© 2022 湘ICP备2022001581号-3