
Aurel
@Aur71All comments
- @Valac01@Aur71
They are good, dont worry
- @donnol87@Aur71
Using padding and margin is normal, so dont worry about it. Also when you downlad the starter files there is a styling guide. There you will find the colors and fonts used in design.
- @hafsatun2020@Aur71
Put bouth of them inside a container.
.container { display: flex; gap: 10px; }
Or you can just use margin-top on the price and margin-bottom on the text.
Marked as helpful - @DavincyProject@Aur71
Put bouth images inside your img-container. To the desktop image give an id = "desktop-img". To the mobile image give an id = "mobile-img"
#desktop-img { display: block; } #mobile-img { display: none; }
Now you just have to use a media querie so you can switch the display when you hit a break point.
@media only screen and (max-width: 600px) {
#desktop-img { display: none; } #mobile-img { display: block; }
And last change the direction of your container
.container { flex-direction: column; } }
Marked as helpful - @JacobMarshall0@Aur71
For better accessibility use semantic html, like header, main, footer, etc (in this case i think you shoud wrap all the content in a <main> element). Is good practice to only use a slinge <h1> on your page for your most important title . Also use the alt attribute from your images.
Marked as helpful