3column preview preview card component using html and css

For the code layout I would recommend using something similar to this:

<main>
main content here
</main>
<footer class="attribution">
attribution text here
</footer>

body{
display: grid;
grid-template-rows: 1fr auto;
}

I would recommend using the following to centre layouts in this particular case:

main{
display: grid;
place-items: center;
}

Check out this link: https://1linelayouts.glitch.me/

add me on discord, we can chat more there.

Some times after glancing at the image:

• you should change your background color, you can do this in the body section of your css
• your buttons should have a border on them, you can fix this by using the border:none; property on the buttons.

As for your centering you can try making the width: 100%; and the height: 100vh; Im still learning so i always have to play around with the centering but im always happy to help over zoom if you want. I hope some of this was helpful for you. feel free to reach out on discord if you need more context.