I recently set up a webpage with a CSS grid that centers the main section at 80% width.
<html>
....
<body>
<main>
<section>
</section>
</main>
</body>
....
</html>
main {
display: grid;
justify-items: center;
}
section {
max-width: 80%;
min-height: 100%
}
Now, I am looking to add a second section using a PHP if statement so that both sections can be displayed right next to each other at 50% each without changing the CSS via PHP. Simply adding another section results in it being displayed above or below the first one.
I attempted to use grid-auto-columns and setting grid-template-rows to 100%, but neither worked as expected.
Any suggestions on how to resolve this issue?