CODEWITHSUNDEEP
cssoverflow
clarkk
clarkk

Reputation: 27669

one div in another with overflow

How can you have one div inside another?

The inner div has to fit inside the outer with overflow:auto;. The outer div has to make a small frame around the inner div with padding:1px.

http://jsfiddle.net/CbZxC/

Upvotes: 2

Views: 793

Answers (3)

helpermethod
helpermethod

Reputation: 62145

You have to float the inner div:

div.inner {
    background:#ff0000;
    padding: 1px;
    float: left;
}

and put overflow: auto; into the outer div:

div.outer {
    position:absolute;
    width:200px;
    height:50px;
    left:50px;
    top:50px;
    border:1px solid #000000;
    background:#ffffff;
    overflow: auto;
}

Sure you don't want the padding in the inner div?

Upvotes: 0

Matt Bradley
Matt Bradley

Reputation: 4495

Try putting the height and width properties on the inner div. Like this: http://jsfiddle.net/CbZxC/1/

Upvotes: 1

ayyp
ayyp

Reputation: 6598

If I understand your question correctly, you could also just add overflow:auto; to the outer div and then the inner will stay inside. http://jsfiddle.net/zKAnv/

Upvotes: 1

Related Questions