I have a grid column layout of: [full-width] [breakout] [content] [breakout] [full-width].
Within the [breakout] column I have an icon, and in the [content] column I have a section header, and originally wanted my scrollable highlight cards. However, this hides/clips the content under the left columns when scrolling.
To avoid this, I have the cards using the [full-width] but they are not aligned to the <h2> and <p> elements above in the section header.
I want the first card to left-align to the section header <h2> above. I'd like to avoid using the current spacer div I'm using in the flexbox or estimating a best margin/padding to avoid potential misalignment.
https://jsfiddle.net/joshhhh/5m9r2yab/2/
