Cheat Sheet Grid

I’m trying to work on my Cheat Sheet and I’m satisfied with the HTML so I’m trying to set up a grid where my tables can be in a “A A”
“B B”
“C”
. But whatever I try just winds up not working and I wind up with a disaster on my hands. How would I best go about creating this style I want?

Hi

Maybe try this:

  • put all <div class="table> into <main>
  • use css as below:
body{
    background-color: gray;
    font-family: Helvetica, sans-serif;
}
h1{
    text-align: center;
}
.table{
    align-items: center;
}
table{
    margin: 0 auto;
    border: 2px solid black;
}

main {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: repeat(3,1fr);
}

Not only was that what I needed but you actually helped me realize a second issue, I wasn’t using a main tag for everything after the header. Thanks!