stefan22
11/19/2017 - 6:42 AM

Utilizes a column-width property and a column-count To create a multi-column layout It has built-in responsiveness

Utilizes a column-width property and a column-count To create a multi-column layout It has built-in responsiveness

multiColumnLayout.html
content_copyfile_download
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Chapter 1: float</title>
	<link rel="stylesheet" href="../assets/css/common.css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Slab" rel="stylesheet">
    <style>
        .example {
            column-count: 3;
        }
    </style>
</head>

<body id="ch1">
    <header class="example-header">
        <ul class="meta">
            <li class="book">The New CSS Layout</li>
            <li class="author">Rachel Andrew</li>
            <li class="chapter">Chapter 3</li>
            <li class="index"><a href="../">Index of examples</a></li>
        </ul>
        <div class="inner">
            <h1>Multiple Column Layout</h1>
        </div>
    </header>
    <div class="example">

       <p>One of the first questions the visitor to an aerodrome, when watching the altitude tests, asks is: "How is it known that the airman has risen to a height of so many feet?" Does he guess at the distance he is above the earth?</p>
        <p>If this were so, then it is very evident that there would be great difficulty in awarding a prize to a number of competitors each trying to ascend higher than his rivals.</p>
        <p>No; the pilot does not guess at his flying height, but he finds it by a height-recording instrument called the BAROGRAPH. In the last chapter we saw how the ordinary mercurial barometer can be used to ascertain fairly accurately the height of mountains. But the airman does not take a mercurial barometer up with him. There is for his use another form of barometer much more suited to his purpose, namely, the barograph, which is really a development of the aneroid barometer.</p>
        
	 
    </div>
</body>
</html>