Title: How to hide scroll bar but want to it keep working
Tags: javascript;scrollbar
Question: Here is code
#scroll{
overflow-y:scroll;
max-height:500px;
width:267px;}
I explored it on Stackoverflow and i got many answers but they were explained with two conatiners in HTML but i have only one div and want to apply it on that. THANKS


Here is another answer: You should look into parent child approach as it is the recommended one. Give your element scroll bars, wrap it in a
containing element, and make the containing element element smaller, and give it:
overflow: hidden;
In your current scenario you can do this pure CSS.
Hide scroll bars in Webkit-based browsers (Chrome and Safari).
.element75b5:f2c1:f5d7:b954:8dc3:cee9:baf:a8c0-webkit-scrollbar { width: 0 !important }
Hide scrollbars in IE 10+.
.element { -ms-overflow-style: none; }
Hide scrollbars in Firefox, but it has been deprecated.
.element { overflow: -moz-scrollbars-none; }
JSFiddle
Comment for this answer: Hi thanks for your time .. I think it is for whole webpage . But i need it for a specific Div. Actually I'm using it with drop down menu so need to apply it on drop down section where the options are lot of -- Here is screenshot please have a look --   https://drive.google.com/file/d/0B0w8jyKHNbVFMXJDdzU2RFdOSW8/view?usp=sharing

{'source': 'StackExchangeDataset', 'subset': 'stackoverflow.com', 'metadata': {'AnswerCount': 1, 'CommentCount': 0, 'ContentLicense': 'CC BY-SA 3.0', 'CreationDate': '2015:00:04/01/15', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<javascript><scrollbar>', 'Title': 'How to hide scroll bar but want to it keep working', 'ViewCount': 39, 'id': 29391177, 'user_AboutMe': None, 'user_AccountId': 5790994.0, 'user_DisplayName': 'harwinder', 'user_Reputation': 9.0, 'user_Views': 3.0, 'user_id': 4568475.0}}