I'm new to web development and i had trouble in making the website responsive. What is the best way to make a website responsive easily? I had to write a lot of css code, is there any way to write less css code without using tools like bootstrap?
Nicolas Blasutig
@NicoBlasAll comments
- @IntisarArikSubmitted over 2 years ago@NicoBlasPosted over 2 years ago
Hi Arik.
The way i do the CSS responsive is mobile first. I use relative units like % or VW/VH and lot of Flexbox. This way it adapts easily to different resolutions. Make sure you use media queries too for making sure it looks good on every device. At least i recomend using a media query with min-width of 600px and another for min-width of 1281px. Use the dev tool in your browser in order to see if your app breaks in some point. If it does, you can add another media query for that particular resolution that is making trouble and make sure you are using relative units.
Hope it helps
Marked as helpful2 - @EliusHHimelSubmitted over 2 years ago@NicoBlasPosted over 2 years ago
Hi, good work. I liked the color.
I would have done the conteiner with a defined height or the bottom of the box with position absolute, so the box doesn´t change every time that you press the button, in my opinion is better if the button is always in the same place, but thats me.
keep it up!
0 - @Aaron-MorseSubmitted over 2 years ago@NicoBlasPosted over 2 years ago
Hello,
Good job, it looks good.
It feels to me that its better to make something so the grey box do not move or change size between advices.
I leave my solution in case you want to ckeck it out.
https://www.frontendmentor.io/challenges/advice-generator-app-QdUG-13db/hub/react-advice-generator-HkzTFf9G9
Keep up the good work!
0