CODEWITHSUNDEEP
htmlcss
Zafta
Zafta

Reputation: 667

how to hide scrollbar even if div is not larger then max-height

i have a div named panel, CSS of whose is

enter image description here

.msg_panel
{
width:100px;
height:45px;
max-height:200px;
padding: 3px;
overflow-y:scroll;
overflow-x:hidden;
}

now even if height of panel is not larger than the max-height, i am getting the scrollbar visible(you can see in the pic). I want scrollbar visible only if max-height is attained.

i tried javascript, but can it be done only in css

Upvotes: 13

Views: 21681

Answers (3)

Arun Bertil
Arun Bertil

Reputation: 4638

Set overflow-y to auto which removes the vertical scroll and it will appear only if the content exceeds your max-height of 200px...

.msg_panel
{
  overflow-y:auto;
}

Upvotes: 6

Kevin Bowersox
Kevin Bowersox

Reputation: 94429

Set the overflow-y property to auto

Working Example http://jsfiddle.net/TLwcX/1/

Upvotes: 41

mishik
mishik

Reputation: 10003

You have explicitly stated that you need vertical scroll always visible: overflow-y: scroll;

To let browser decide when to show the scroll use this: overflow-y: auto;

Upvotes: 3

Related Questions