CODEWITHSUNDEEP
cssimagepositionwidthoverflow
lclum
lclum

Reputation: 41

How to overflow background Image off screen

Right now I'm coding a site where all of the content is positioned in the center of the page. I want a little plane icon to be positioned with its trail running off the right side of the screen.

However, the image keeps creating a horizontal scroll bar for the rest of the image.

How do i place an image where the remaining part of the image is only visible upon resizing the browser.

See attached code:

.home-planepath {
    position:absolute; 
    left:50%;
    width:100%;
    height:62px;
    z-index: 1;
    margin-top:442px;
    margin-left: -440px;
    overflow: hidden;
    background:url(images/home-planepath.png) no-repeat;
}

Upvotes: 2

Views: 4615

Answers (1)

anael
anael

Reputation: 17

You should set overflow:hidden on your container, i.e .homehover instead of .home-planepath

Upvotes: 1

Related Questions