skip to Main Content

I am creating my very first website and I am struggling to have the image (which is in the header section within a div container) to reach the very edge of the webpage so there is no gap visible. It is not stretching wide enough to fill the space entirely. I’ve attached a screenshot but unsure if you can view it. (https://phpout.com/wp-content/uploads/2024/04/nqLp4.png). I’ve attached a second image of the code I’m using in HTML.
(https://phpout.com/wp-content/uploads/2024/04/NpBEq.png)

I tried Googling and Youtube videos but couldn’t find any answers.

2

Answers


  1. It’s a common issue in CSS where the body of the webpage has a default margin. This default margin is causing your image not to reach the edge of the webpage. You can remove this default margin by adding the following CSS rule:

    body {
        margin: 0;
    }
    

    This rule sets the margin of the body element to 0, effectively removing the gap you’re seeing. Add this rule to your CSS, and your image should now stretch to the edges of the webpage. If you’re still facing issues, please provide more details or code snippets for further assistance.

    Login or Signup to reply.
  2. This problem is most likely due to default browser styles. Use this tool.
    https://necolas.github.io/normalize.css/

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search