CODEWITHSUNDEEP
htmlcss
ChrisOdney
ChrisOdney

Reputation: 6384

HTML/CSS - Bigger box within a smaller one

I thought if I make a box bigger than its container, the box will be restricted to the size of the container and there will be scroll bars around it.

http://jsfiddle.net/Amnesiac/ekT3h/

But the box actually comes out of the container as in the above example.

Thanks, Chris.

Upvotes: 0

Views: 254

Answers (3)

xception
xception

Reputation: 4287

No, you have to use css overflow to make the scrollbars appear. and you have to have content for them to be active, define the div as big as you actually want it to be displayed.

Updated your fiddle with an example http://jsfiddle.net/ekT3h/2/ made everything bigger for it to be easier to understand. A second fiddle http://jsfiddle.net/ekT3h/4/ marked with names for divs and updated your original css to position the child irrespective of any other content.

Upvotes: 3

prady00
prady00

Reputation: 741

Apply following css:

overflow:hidden

Upvotes: 0

Sudip
Sudip

Reputation: 2051

Use a "overflow:auto" property in your "container" class.

#container{
 height:100px;   
 width: 100px;   
 border: 1px solid red;  
    overflow:auto;
}

Upvotes: 1

Related Questions