@DoyeDesigns
Posted
Hello Aishaskin,
media query is a condition that has to be met before the elements on a webpage changes it’s layout structure to adjust to the user’s screen size.
For example /Default background color / Body{ Background: white; } / On screens that are 400px or less, set background color to red/ @media only screen and (max-width: 400px){ Body{ Background: red; } } /On screens that are 800px or greater, set background color to blue/ @media only screen and (min-width: 800px){ Body{ Background: blue; } } Hope this helps
Here is a link to better understand it https://www.w3schools.com/css/css_rwd_mediaqueries.asp
Also you should wrap all the work to be done in the body in a main tag.. html semantics, it make your page more accessible. So you can remove the div with the container class and use a main tag instead
You should not put a main tag inside a div. In terms of hierarchy a main tag comes before a div tag. So a div tag should be inside a main tag not the other way around.
To center the old price and new price add these codes in the parent element holding both of them. That is the div with the “inline” class;
.inline{ Justify-content: center; Align-items: center; }
Feel free to reach out to me for more clarification. Happy coding:)
