Difference between revisions of "M365/test1"
< M365
Jump to navigation
Jump to search
Beth.webster (talk | contribs) |
|||
| Line 1: | Line 1: | ||
| − | + | {{#CSS: | |
| − | |||
| − | < | + | <style> |
| − | + | * { | |
| − | + | box-sizing: border-box; | |
| + | } | ||
| − | + | /* Create three equal columns that floats next to each other */ | |
| − | { | + | .column { |
| + | float: left; | ||
| + | width: 33.33%; | ||
| + | padding: 10px; | ||
| + | height: 300px; /* Should be removed. Only for demonstration */ | ||
| + | } | ||
| − | + | /* Clear floats after the columns */ | |
| − | + | .row:after { | |
| − | + | content: ""; | |
| − | + | display: table; | |
| − | + | clear: both; | |
| + | } | ||
| + | }} | ||
| − | </ | + | <h2>Three 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> | ||
| + | <div class="column" style="background-color:#ccc;"> | ||
| + | <h2>Column 3</h2> | ||
| + | <p>Some text..</p> | ||
| + | </div> | ||
| + | </div> | ||
Revision as of 20:28, 4 March 2023
Three Equal Columns
Column 1
Some text..
Column 2
Some text..
Column 3
Some text..
