john
john

Reputation: 201

image is stuck on top left of the screen

https://jsfiddle.net/fc90p0bf/

<body>
        <div id = "main" class = "header">
            <div id = "logo">
            <a href = "file:///C:/Users/Owner/AppData/Roaming/Sublime%20Text%203/Packages/User/practice1.html">
            <img src = "reddit_web.png"/> </a>
            </div>
      </div>

}
#main.header{
    position: relative;
    background-color: #232f3e;
    top:0;
    left:0;
    height: 100px;
    width: 1800px;
    min-width: 1217px;
}
#logo{
    position: absolute;
    top: 15px;
    left: 46px;
}

the image is stuck to the top left but i have the positioning in relative. how do i fix this?

Upvotes: 2

Views: 1704

Answers (1)

theblindprophet
theblindprophet

Reputation: 7937

Your div is positioned absolutely so the img is ignoring it and positioning itself as the first item which would be in the top left. I assume you want it below the div, so you either need to edit the positioning of the img or you need to change div to position: relative as well.

Upvotes: 1

Related Questions