CODEWITHSUNDEEP
htmlcssoverflowpositioningabsolute
Jordy
Jordy

Reputation: 4809

Absolute div no overflow

I have two divs:

#container{
    max-width:1000px;
    margin:0 auto;
}

Inside this container I have another div:

#image{
    position:absolute;
    margin-left-200px;
    width:500px;
    height:400px;
    background-image:url('images/image.png');
    left:50%;
    overflow:hidden;
}

When I resize my window to a very small viewport, the full image cannot be displayed. The user is able to scroll to the right. How can I prevent that?

Thanks!

Upvotes: 0

Views: 6113

Answers (1)

fred02138
fred02138

Reputation: 3361

You need to add this to your CSS:

html {
    overflow:hidden;
}

Here is working jsfidde: http://jsfiddle.net/5tDbx/

Upvotes: 1

Related Questions