Css overflow-y: how to show only when needed

Tags: html,css,css3

Problem :

I'm adding the overflow-y parameter to "scroll" in my css in order to have scrolling bar in case of overflow..

My problem is that if the content is not overflowing - i'm still having the blank scroll bar.

How can i set the overflow to show the scrolling bar only when needed ?

Solution :

You can set it to auto

overflow-y : auto;

It will only show scroll bar in case of overflow.

Refer : What browsers support `overflow-y`?

    CSS Howto..

    How to dynamically change a class css styling?

    How do you ad stylesheets to JSDOM

    How to create this style of nav bar using exclusively HTML5 and CSS?

    How to style div's so that they don't stack right on top of each other?

    CSS opacity, how to have opaque elements in transparent container element

    How to Fix this CSS and Center the Menu Horizontally?

    how to align div horizontally using CSS?

    how to Design a vista like button using CSS

    How to share CSS StyleSheet amongst projects?

    How to stop grunt compass task compiling sass files intended for include

    how to Styling a “choose file” button using css Only

    How to elasticity of the char length in javascript or css? [duplicate]

    CSS/HTML : how to make something become absolute positioned once you scroll by it

    How to change the value depend on css animation?

    How to apply CSS to buttons?

    How to select children in CSS

    How to use CSS to make this works on retina screen?

    How to display a background image with a:hover

    Show tooltip content when its hovers

    How to scale a div without scaling content

    How to shrink wrap floating content?

    How to hide a div from another div using CSS

    how to make nested flexboxes work

    How to style form submit button in CSS?

    How to make my right-box float right…?

    background-image: url(“images/plaid.jpg”) no-repeat; wont show up

    How to add margin-top to Responsive Multi-Level Menu and not effect navigation animation?

    How to properly align something that resizes in a specific location

    How to make a table with no cells-per-row defined only with CSS

    How can I add CSS and JS in Symfony2?