Only implemented for the voting cards so far, still needs work for the voters.
Removed all the <main> elements on each component - having multiple on a page isn't valid HTML. It was also breaking the flex layout, as some main elements didn't have display: flex set.
Reworked the flex layout so each vote card is 10% of the flex row
Set flex rows to overflow to the left edge, rather than evenly spaced (it looked weird with 2 or 3 cards on a new row spaced evenly really far apart when the first row where tight together)
Set a max width on vote cards so they don't stretch and fill the flex row
Wrapped each vote card in a taller container so the selected card can expand up into it
Removed the height from the voting options container so it can expand beyond this height.
Set margins to push the voting cards a decent space under the voter cards
The only bit I haven't figured out is how to get a bottom border across each row as it adjusts.
Only implemented for the voting cards so far, still needs work for the voters.
<main>
elements on each component - having multiple on a page isn't valid HTML. It was also breaking the flex layout, as some main elements didn't havedisplay: flex
set.The only bit I haven't figured out is how to get a bottom border across each row as it adjusts.