jQuery How to Get Element’s Margin and Padding?

var bordT = $('img').outerWidth() - $('img').innerWidth();
var paddT = $('img').innerWidth() - $('img').width();
var margT = $('img').outerWidth(true) - $('img').outerWidth();

var formattedBord = bordT + 'px';
var formattedPadd = paddT + 'px';
var formattedMarg = margT + 'px';

Check the jQuery API docs for information on each:

  • outerWidth
  • innerWidth
  • width

Here’s the edited jsFiddle showing the result.

You can perform the same type of operations for the Height to get its margin, border, and padding.

Leave a Comment

tech