CSS Margins Help
Hello All, I'm still learning the basics of CSS and am having trouble with my code. Forwhatever reason my main title page that says "PergolaLuxe" has a top and bottom margin, as shown when inspected. I for the life of me cannot find why this is occuring within my code. Any advice is appreciated. Thanks in advance!
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081448753827972/Screenshot_2024-03-20_at_11.42.56_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081449089368124/Screenshot_2024-03-20_at_11.42.47_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081449395290132/Screenshot_2024-03-20_at_11.42.39_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081449638825994/Screenshot_2024-03-20_at_11.42.31_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081449949200384/Screenshot_2024-03-20_at_11.42.23_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081450255122452/Screenshot_2024-03-20_at_11.42.07_AM.png)
![No description](https://answer-overflow-discord-attachments.s3.amazonaws.com/1220081450603515958/Screenshot_2024-03-20_at_11.41.45_AM.png)
3 Replies
Can you paste this into a live sandbox like https://codepen.io, there are some styles in a screenshot that are not shown in the dev tools so it’s hard to tell what’s going on. Html elements have defaults margins and padding , this behaviour is often why it’s common to include *{margin:0;padding:0;} in the css reset. May also be a specificity issue between id selectors and class selectors.
I think you have to reset the
margin
and padding
to 0 and its also a good idea in the future to use box-sizing
. If you apply this to the top of your sheet it should reset it
Let me know if that helpsAdding the border-boxed worked. Thank y'all for your help!