Change width and height of jQuery slider

Question

I want to change the width and height of the jquery slider user interface. I use the ui-lightness theme. I tried to override the default jquery.css by adding the following code to my stylesheet.

 .ui-slider .ui-slider-horizontal { height: .6em; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1em; height: 1em; cursor: default; } 

But the above css does not affect. jquery.css overrides the above style and I don't see any changes in the slider. How to override jquery.css default styles?

Answer 1

Try adding the !important rule after declaring width and height , for example:

 width:1em !important; height:1em !important; 

This should make your ad read.