OBINTUSACADEMY
HOME CONTACT SERVICES PRIVACY
C.B MS-PACKAGES CSS
CSS - Multiple Columns

BASIC

Introduction to CSS Getting Started CSS Basic Structure CSS Syntax CSS Selectors CSS Universal Selector CSS Element Selector CSS ID Selector CSS Class Selector CSS Group Selector CSS Descendant Selector CSS Child Selector CSS Adjacent Sibling Selector CSS General Sibling Selector CSS Pseudo Element Selector CSS Pseudo Class Selector CSS Attribute Selector CSS Comments CSS Rule CSS Colors CSS Foreground and Background Color CSS Fonts CSS Background CSS Background Clip CSS Background Origin CSS Background Size CSS Text/Word Formatting CSS Images

INTERMEDIATE

CSS Borders CSS Margin CSS Padding CSS Dimension CSS Outline CSS Lists CSS Tables CSS Links CSS Overflow CSS Cursor CSS Float CSS Clear CSS Box Sizing CSS Display CSS Positioning CSS Z-Indexing CSS Opacity CSS Icons CSS Media Queries

ADVANCE

CSS Multiple Backgrounds CSS Gradient CSS Shadow CSS 2D Transform CSS 3D Transform CSS Transition CSS Animation CSS Image Reflection CSS Masking CSS Navigation Bar CSS Dropdown CSS !important CSS Specificity CSS Math Functions CSS Web Fonts CSS Pagination CSS Multiple Columns CSS Resizing and Offset CSS Variables CSS Conclusion

CSS Multiple Columns

PREVIOUS NEXT

In this tutorial, I will be showing you every thing you need to know about making multiple columns of text or block of text on your webpage (just like a newspaper)

Multiple Column Properties

column-count used to specify the number of columns the element should be divided into.

TRY IT OUT YOURSELF

column-gap used to specify the spacing between each column

TRY IT OUT YOURSELF

column-rule-style used to specify the type of line style between the columns. For example: solid, dashed, inset, double, etc

TRY IT OUT YOURSELF

column-rule-width used to specify the thickness or thinness of the column-rule-style value.

TRY IT OUT YOURSELF

column-rule-color used to specify the color of the column-rule-style.

TRY IT OUT YOURSELF

column-rule shorthand property for specifying all the column-rule properties. Its syntax is as follows: column-rule: column-rule-width column-rule-style column-rule-color

TRY IT OUT YOURSELF

column-span used to specify how the column should span.

TRY IT OUT YOURSELF

column-width used to specify the width for the column.

TRY IT OUT YOURSELF

columns shorthand property for specifying column width and column count. Its syntax is as follows: columns: column-width column-count

TRY IT OUT YOURSELF

column-fill used to specify how columns are filled.

TRY IT OUT YOURSELF
PREVIOUS NEXT
ADVERTISEMENTS

LEARNING IS A CONTINOUS PROCESS - PRACTICE MAKES PERFECT