CODEWITHSUNDEEP
javascripthtmlcssscrollbarslimscroll
user1492867
user1492867

Reputation: 137

Scroll bar affecting width of div

I am currently trying to implement a time selector like this http://jsfiddle.net/roberttang30/AzRja/.

It is styled like this:

'overflow' : 'visible',
'list-style': 'none',
'position': 'absolute',
'font-size': '115%',
'top': '15%',
'margin-top': '1.7em',
'margin-left': '-25%',
'left': '50%',
'width': '50%',

It works fine but I would now like to add the ability for it to scroll. The problem is that when I enable the scroll bar it narrows the width of the list (which is containing the times). http://jsfiddle.net/roberttang30/GhvYG/

I am currently using slimScroll but I get the same problem with a normal scroll bar.

If think the problem could be something to do with the lines which are used to float the div in the middle :

'margin-left': '-25%',
'left': '50%',
'width': '50%',

Thank you for you help.

Upvotes: 0

Views: 1373

Answers (1)

Euphe
Euphe

Reputation: 3709

Set 

.box {
padding-right:0;
}

Remove

.dropdown{
 overflow:hidden
}

Padding was pushing the scrollbar away from the right. Why .dropdown caused the box to be less wide is unclear to me.

Upvotes: 1

Related Questions