This is a solution to the Four card feature section challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Users should be able to:

• View the optimal layout for the site depending on their device's screen size

• Solution
• Live Site

• Semantic HTML5 markup
• Flexbox
• CSS Grid
• Mobile-first workflow
• SCSS

You can match all the elements with a class that starts with a specific set of characters. For example, something like

    article[class*="card"] {
      margin-bottom: 0;
      padding: 2rem 2.3rem 2.1rem;
    }

will match only the articles with a class that starts with “card”.

• Match all elements having class name starting with a specific string
• Creating a nice layout CSS Grid layout using grid template areas.

• Frontend Mentor - @Filippo-B