Width of range boxes cut off after three digits

The width of the number box in the range field is being cut off after three digits.

(Please see attached.)

Tried testing it with various different browsers (IE, Firefox, Opera) and it's still being cut off.

Anyone can help or advise?

Thanks!

range field box width.jpg · 6.2K · 235 views
Quote · 22 Nov 2011

Suspect it has something to do with the CSS but could anyone advise which file / line to look at?

Quote · 23 Nov 2011

in templates/base/css/forms_adv.css

Line 486 look for this. Change line indicated from 18 to 30

.form_advanced .ui-slider {
    height: 16px;
    width: auto;
    margin-top: 0px;
    margin-right: 30px;
    position: relative;
    border: none;
}

Then to line 505 look for this. Change line indicated from 16 to 28

.ui-slider-handle {
    position: absolute;
    top: 1px;
    height: 12px;
    width: 28px;
   
    /*padding-left: 2px;
    padding-right: 2px;*/
    cursor: pointer;

    text-align: center;
    color: #333333;
    overflow: hidden;
    font-size: 10px;
   
    border: 1px solid #999999;
    background-color: #ffffff;
    background-image: url(../images/slider_trigger_bg.gif);
    background-position: top left;
    background-repeat: repeat-x;
}


Save changes and clear dolphin cache.

https://www.deanbassett.com
Quote · 23 Nov 2011

Thanks Deano!!!

That worked perfectly!! :)

in templates/base/css/forms_adv.css

Line 486 look for this. Change line indicated from 18 to 30

.form_advanced .ui-slider {
    height: 16px;
    width: auto;
    margin-top: 0px;
    margin-right: 30px;
    position: relative;
    border: none;
}

Then to line 505 look for this. Change line indicated from 16 to 28

.ui-slider-handle {
    position: absolute;
    top: 1px;
    height: 12px;
    width: 28px;
   
    /*padding-left: 2px;
    padding-right: 2px;*/
    cursor: pointer;

    text-align: center;
    color: #333333;
    overflow: hidden;
    font-size: 10px;
   
    border: 1px solid #999999;
    background-color: #ffffff;
    background-image: url(../images/slider_trigger_bg.gif);
    background-position: top left;
    background-repeat: repeat-x;
}


Save changes and clear dolphin cache.

 

Quote · 23 Nov 2011
 
 
Below is the legacy version of the Boonex site, maintained for Dolphin.Pro 7.x support.
The new Dolphin solution is powered by UNA Community Management System.