Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • William Delanoy• 60

    @wdelanoy

    Posted

    I've started naming my custom properties a little bit more generic. For example, instead of using '--primary-red' maybe name it '--primary-team-builder'. That way if you ever want to change the color away from red, it becomes less confusing for others who will be accessing your code

    I also think you are nesting divs to deeply. Your nesting is 5 layers deep. I think that is unnecessary. Take a look at my code. I'm only nesting 3 layers deep.

    For the header - main>header>content (h1, p) For the cards - main>div>content (h2, p, svg)

    1
  • William Delanoy• 60

    @wdelanoy

    Posted

    Hey! Overall your result looks great!

    Here are a couple of suggestions to cut down on needing to do extra work:

    • Try using custom properties/variables to define your colors in the root of your CSS file. This way, you can use the variables everywhere in you CSS code instead of using the hexcodes. This will allow you much more flexibility if you ever want to change the colors in the future. All you need to do is change the defined color in the custom property, and it will flow down everywhere you invoke that property. Take a look at my CSS file to see what I'm talking about

    • Think about using a second class for all three of your divs (.sedans, .suvs, .lux). Maybe call the class "cards". Since all 3 cards have the same margins and padding, you could define those properties just once, instead of re-defining them 3 times - 1 for each separate card

    • For your buttons, you should have all three of them use the same class instead of a different class for each one. The only thing that you would need to change inside of this class would be the color. Instead of having 3 classes and defining the color in each one to match the background, use the single class and assign the background-color property a value of "inherit". This will allow the button to inherit the background color of its ancestor, which you have already defined

    Here's a link to my submission so you can see what I'm talking about:

    https://github.com/wdelanoy/3-column-preview-card

    https://wdelanoy.github.io/3-column-preview-card/

    1