smares smares - 8 months ago 62
CSS Question

Get space between flexbox elements with JavaScript

Is it possible to get the space between two elements that use

justify-content: space-between
in a flexbox using JavaScript?


It's possible. Example

function calcSpaceBetween(){
  var red_pos = $('#d1').position().left + $('#d1').width();
  var blu_pos = $('#d2').position().left;

  var space = blu_pos - red_pos;

  $('#space').text(space + ' px')
  1. Calculate the position of the left one (red) + it's width

  2. Find the position of the right one (blue)

  3. (blue.position) - (red) + (red.width)