When working with columns, you might notice that between each column is a space, or gap. The browser sets the gap to 1em. Generally, 1em is a comfortable space between columns. If you find that the gap is too wide, or too narrow, you can adjust it with column-gap. article { -webkit-columns: 2; -moz-columns: 2;
C
When you add height to a multi-column element, you can control how the content fills the columns. The content can be balanced or filled sequentially. ul { height: 300px; -webkit-columns: 3; -moz-columns: 3; columns: 3; -moz-column-fill: balance; column-fill: balance; } This property is only available in Firefox. Firefox will automatically balance content in a height-constrained
If you need an exact numbers of columns when designing a multi-column layout, use column-count. .lead { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } Given the number of columns, the browser will evenly distribute the content in exactly that number of columns. This property can also be used in the shorthand for columns and can
The color property in CSS is specifically for controlling the color of text. p { color: green; } I’m an example of the above CSS taking effect on a specific paragraph. You can use any color value, for instance: #f00 #ff0000 rgb(100,100,100) rgba(100,100,100,0.5) hsl(20, 100%, 50%) hsla(20, 100%, 50%, 0.5) named colors The color property