19
edits
Changes
Jump to navigation
Jump to search
Line 1:
Line 1: − {{#CSS:+ − + − + − * {+ − box-sizing: border-box; + − }+ + − /* Create two equal columns that floats next to each other */+ − .column {+ − float: left; + − width: 50%;+ − padding: 10px;+ − height: 300px; /* Should be removed. Only for demonstration */ − } − + − + − content: "";+ − display: table; − clear: both; − } − − }} − <h2>Two Equal Columns</h2>+ − + − <div class="row"> − <div class="column" style="background-color:#aaa;"> − <h2>Column 1</h2> − <p>Some text..</p> − </div> − <div class="column" style="background-color:#bbb;"> − <h2>Column 2</h2> − <p>Some text..</p> − </div> −
Replaced content with "A playground, sandbox, test zone for Marc B and Thian. :-) <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-9FPK3M5Y7K"></scr..."
A playground, sandbox, test zone for Marc B and Thian. :-)
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Google tag (gtag.js) -->
<style>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9FPK3M5Y7K"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-9FPK3M5Y7K');
</script>
<html>
<body>
<head>
/* Clear floats after the columns */
</head>
.row:after {
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</style>
</body>
</html>
</div>
