search

vikramvi / Clipboard-landing-page

https://www.frontendmentor.io/challenges/clipboard-landing-page-5cc9bccd6c4c91111378ecb9 Put your layout skills to the test with this HTML & CSS landing page challenge. This challenge includes a design for hover states. - [LIVE WEBSITE - CLICK BELOW]
https://vikramvi.github.io/Clipboard-landing-page/
1 stars 0 forks source link

large padding / margin vs usage width + max-width option #2

Closed vikramvi closed 2 years ago

vikramvi commented 2 years ago 
Your overflow is being caused on small screens by all the large explicit margins and paddings you are setting on the sides of elements
Instead of adding values like padding: 8rem;  use techniques like width: 100%; max-width: 20rem;

https://frontendmentor.slack.com/archives/CCYHFT85B/p1656069288485599?thread_ts=1656050081.188389&cid=CCYHFT85B

vikramvi commented 2 years ago

Google "when to use width and max-width"

https://css-tricks.com/tale-width-max-width/

https://blog.prototypr.io/what-even-is-the-difference-between-width-and-max-width-8f37b282c7f1

vikramvi commented 2 years ago

https://github.com/vikramvi/Clipboard-landing-page/commit/6eb3d730b56fba79a27a305ec2576ff70909a568