Can I use Jquery to find an element and set it's CSS width to current-width - x?

Question

Say I need to correct a number of elements widths by 19px.

Is it possible to find elements and set the found elements CSS-width like so:

 $el.find( '.ui-content' )
    .css({'width': "parseFloat(found_element_current_width) -19" })

If not, what's the best way to do this?

Answer 1

Yes.

$el.find( '.ui-content' )
    .width(function(i, width) { return width - 19;  })

Answer 2

You can use css 's function:

$el.find( '.ui-content' )
    .css('width', function(i, w){
         return (parseFloat(w) - 19) + 'px'
    })

Answer 3

From the documentation of the .css() function:

As of jQuery 1.6, .css() accepts relative values similar to .animate() . Relative values are a string starting with += or -= to increment or decrement the current value. For example, if an element's padding-left was 10px, .css( "padding-left", "+=15" ) would result in a total padding-left of 25px.

So you could just do:

$el.find( '.ui-content' )
.css('width', '-=19');

Answer 4

yes you can.

$el.find( '.ui-content' )
    .css('width', parseInt(yourwidth) - 19)