Difference between revisions of "M365/test"
< M365
Jump to navigation
Jump to search
Line 1: | Line 1: | ||
− | <div class="container"> | + | <div class="container" style="display: flex; flex-wrap: wrap; justify-content: space-between;"> |
− | <div class="column"> | + | <div class="column" style="flex-basis: calc(33.33% - 20px); margin-bottom: 20px;"> |
− | <div class="content"> | + | <div class="content" style="background-color: #f2f2f2; padding: 20px;"> |
<h2>Column 1</h2> | <h2>Column 1</h2> | ||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam eleifend elit enim, non ultrices dolor scelerisque id. Integer auctor nunc purus, ac suscipit lectus tristique eu.</p> | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam eleifend elit enim, non ultrices dolor scelerisque id. Integer auctor nunc purus, ac suscipit lectus tristique eu.</p> | ||
</div> | </div> | ||
</div> | </div> | ||
− | <div class="column"> | + | <div class="column" style="flex-basis: calc(33.33% - 20px); margin-bottom: 20px;"> |
− | <div class="content"> | + | <div class="content" style="background-color: #f2f2f2; padding: 20px;"> |
<h2>Column 2</h2> | <h2>Column 2</h2> | ||
<p>Phasellus accumsan lobortis magna, a ultricies sapien hendrerit id. Vestibulum sed lorem id libero lobortis aliquam in vitae enim. Ut ornare dapibus velit, eget egestas enim bibendum ac.</p> | <p>Phasellus accumsan lobortis magna, a ultricies sapien hendrerit id. Vestibulum sed lorem id libero lobortis aliquam in vitae enim. Ut ornare dapibus velit, eget egestas enim bibendum ac.</p> | ||
</div> | </div> | ||
</div> | </div> | ||
− | <div class="column"> | + | <div class="column" style="flex-basis: calc(33.33% - 20px); margin-bottom: 20px;"> |
− | <div class="content"> | + | <div class="content" style="background-color: #f2f2f2; padding: 20px;"> |
<h2>Column 3</h2> | <h2>Column 3</h2> | ||
<p>Curabitur vel neque vel tortor accumsan bibendum. Nullam a mauris ipsum. Nullam ullamcorper, mauris ac vehicula varius, turpis purus aliquet est, eget pretium odio urna eu enim.</p> | <p>Curabitur vel neque vel tortor accumsan bibendum. Nullam a mauris ipsum. Nullam ullamcorper, mauris ac vehicula varius, turpis purus aliquet est, eget pretium odio urna eu enim.</p> | ||
</div> | </div> | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
− |
Revision as of 09:33, 5 March 2023
Column 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam eleifend elit enim, non ultrices dolor scelerisque id. Integer auctor nunc purus, ac suscipit lectus tristique eu.
Column 2
Phasellus accumsan lobortis magna, a ultricies sapien hendrerit id. Vestibulum sed lorem id libero lobortis aliquam in vitae enim. Ut ornare dapibus velit, eget egestas enim bibendum ac.
Column 3
Curabitur vel neque vel tortor accumsan bibendum. Nullam a mauris ipsum. Nullam ullamcorper, mauris ac vehicula varius, turpis purus aliquet est, eget pretium odio urna eu enim.