I have a div with height in %
and overflow: hidden;
. Inside a div with overflow: auto
doesn't show scroll when content is big.
Is it posible to do that i want?
Live: http://indorio.ru/inside-box.html (#overlay-box fluid with height of %)
Set the div with a width or height, (otherwise it won't know whether something is overflowing). Then, add the overflow:hidden; CSS property-value pair.
overflow: hiddenWith the hidden value, the overflow is clipped, and the rest of the content is hidden: You can use the overflow property when you want to have better control of the layout. The overflow property specifies what happens if content overflows an element's box.
To change this, set the min-width or min-height property.” This means that a flex item with a long word won't shrink below its minimum content size. To fix this, we can either use an overflow value other than visible , or we can set min-width: 0 on the flex item.
The difference For that, you need overflow: auto , which lets a browser automatically determine if a scroll bar is needed — or not. So in short: overflow: scroll : Always show a scroll bar. overflow: auto : Show a scroll bar when needed.
Overflow requires a height to be specified, otherwise the element will wrap its contents. Depending on your situation you could specify the height as 100%:
#outer {
height: 400px;
padding: 10px;
background: red;
}
#inner {
height: 75%;
padding: 10px;
background: blue;
}
#scroll {
overflow: auto;
height: 100%;
background: green;
}
#content {
height:400px;
}
http://jsfiddle.net/3xe7k/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With