The main purpose of this example is to discuss Web browser support for CSS.
Some style properties are so new that not all browsers currently support them in a uniform way.
Other style properties are currently supported by all browsers, but only very recently, so older browser versions don't support them. It takes a while for older browser versions to gradually vanish. In many situations, developers don't use the recent-support CSS properties until they are guaranteed to work in virtually everyone's Web browser.

When you see style properties that begin with weird prefixes (-webkit, -moz, -ms), it means that the browser has not fully implemented the CSS property according to the W3C recommendation. 
      -webkit-style-property            (webkit rendering toolkit is used by Chrome, Safari, and Opera browsers)
      -moz-style-property               (moz refers to the Firefox browser from Mozilla foundation)
      -ms-style-property                (ms refers to MicroSoft's Internet Explorer browser)
For example, see the W3Schools CSS Box Sizing Page. Recall the the box-sizing property was used in the previous examples to make column widths add up to 100% more easily.
All the current browsers support it, but only since about 2011. For example for Google Chrome, version 10 of the browser was the first Chrome version to support it without the -webkit prefix.

For another example, see the W3Schools CSS Multiple Columns Page. Browsers will soon have better CSS support for creating columns without having to use floated blocks. But at the time this example was written, CSS column support is not ready for prime time. It will be several years before developers can freely use built-in CSS column support. Even then, many millions of existing Web pages will still be using floated blocks to create columns.

For a final example, see the W3Schools CSS Flexible Box Page. At the time this example was written, flexbox styling is also not ready for prime time.

The example below shows flexboxes used to create columns that have gutters and solve the uniform column height problem detailed in the previous example. The columns below will uniformly grow to match the height of the column with the most content.

Flexboxes are more versatile for a variety of uses than the built-in column support W3C has recommended in its CSS Multiple Columns Page discussed just above. At this point, it's not clear which new CSS capability will become the go-to way that developers will use to create columns in Web pages. Not not all upgrades introduced by the World Wide Web Consortium are embraced by developers, but most are. In the end, the W3C is sometimes influenced by trends professional developers end up following, rather than by what theoretically seems best.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. Cras dapibus. What the cras? Just adding some extra cras to make this column bigger.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus.