Dynamic Padding (jQuery)

Question

$('#menu .sub-right').css( 'paddingLeft', $('#menu .sub-left').width() );

nor

$('#menu .sub-right').css({'padding-left': $('#menu .sub-left').width()});

...these work. What am I doing wrong?

Thanks!

Answer 1

Does this work?

$('#menu .sub-right').css( 'padding-left', $('#menu .sub-left').width()+"px" );

The width function documentation states:

The difference between .css(width) and .width() is that the latter returns a unit-less pixel value (for example, 400) while the former returns a value with units intact (for example, 400px). The .width() method is recommended when an element's width needs to be used in a mathematical calculation.

But since CSS expects ###px, you can use the above code or this code:

$('#menu .sub-right').css( 'padding-left', $('#menu .sub-left').css('width') );

Either one should work.