CODEWITHSUNDEEP
htmlcss
tzumd
tzumd

Reputation: 33

Div moving away when the window gets resized

i have the following div on my site

 <div id="div"></div>


 #div {
        
        height: 400px;
        width: 300px;
        position: absolute;
        right: 59%;
        text-align: left;

    }

But if the page get´s resized, the div is moving away. Can someone help me with this ?

Upvotes: 0

Views: 36

Answers (2)

HamiD
HamiD

Reputation: 1090

because you use %. you need to position right to something else like:

<div id="parent"> <div id=div> Text </div></div>

#parent{
     position:relative;
     width:100% //you can decide.
}
#div {
    
    height: 400px;
    width: 300px;
    position: absolute;
    right: 20rem;
    text-align: left;

}

Upvotes: 1

called me anh
called me anh

Reputation: 1

According to W3C, the right property sets the right edge of an element to a unit to the right of the right edge of its nearest positioned ancestor. In your case, the ancestor is body, so when you resize your window, the width of window change so it push the div to 59% to the right side

Upvotes: 0

Related Questions