@vanzasetia
Posted
Hi, Dribbz! 👋
A couple of suggestions:
- No extra element: You do not need an extra
<div>
element—<div class="grid-container">
—to wrap all the card sections. You can use the<body>
element as the grid container of the card or the<main>
element. Then, use the<main>
element as the.grid-container
. - Use appropriate element: The content below the "Why Us" text is a list of reasons, so you should use a list element.
- Remove default styling: By default,
<p>
elements will havefont-size: 1rem
. You can removefont-size: 1rem
from the.description
styling.
I hope my suggestions help you. Have fun coding! 😄
Marked as helpful
@Dribbz
Posted
Thank you for reaching out
Regarding the <main> element i heard somewhere on YouTube while I was learning that it was bad practice to apply a grid container to main rather using <div class=“container”> I will research it further and if it’s okay I will edit it in my code
Using the ul li element makes sense in this context so I will be changing that
I will also remove the default styling @vanzasetia
@vanzasetia
Posted
@Dribbz
You are welcome!
I think about avoiding the <main>
element as a grid container depending on the context. I usually will have a <div class="container">
. In this case, I do not see any issue with making the <main>
element as a grid container. Also, you will end up with less code by doing it.