Untitled
unknown
plain_text
a year ago
959 B
5
Indexable
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Responsive Columns</title> <style> /* Base styles for columns */ .column { float: left; width: 50%; /* Display two columns side by side */ box-sizing: border-box; padding: 10px; } /* Clear floats after the columns */ .row:after { content: ""; display: table; clear: both; } /* Media query for screens with maximum width of 600px */ @media only screen and (max-width: 600px) { .column { width: 100%; /* Make columns full width */ } } </style> </head> <body> <div class="row"> <div class="column" style="background-color:#aaa;"> <h2>Column 1</h2> <p>Content for column 1 goes here.</p> </div> <div class="column" style="background-color:#bbb;"> <h2>Column 2</h2> <p>Content for column 2 goes here.</p> </div> </div> </body> </html>
Editor is loading...
Leave a Comment