Posting my site back on here to try to get some more help with it. I have fixed all the layout issues I was having before. Now I am down to adding media queries to make this site responsive for different screen sizes. To be honest I am lost with this part, I have read alot online and don’t understand where to begin. Am I to add media queries and asign them to the whole body of the page, do I need to do item by item, section by section?
I also am trying to get the form to email me without another screen popping up to go into an email application. I have read that I need to use PHP, I tried to copy and paste some script into mine to get it to work but with no luck so I took it out. This is my first time trying this as well.
Edit: for some reason the “Our customers are seeing big results” is shifting to the left when resizing the screen smaller.
Media queries are added at the end of the CSS file.
You have to write for each Class inside each media query.
example:-
.class1 {
width: 100px;
}
.class2 {
... some properties...
}
@media (min-width: 500px) { // you are telling that when the minimum screen is atleast 501px then apply these stylings else the one at the top..
.class1 {
width: 200px;
.....
}
.class2 {
some other properties....
}
}
you can also write media queries for different display sizes