setDivCentered function

void setDivCentered(DivElement div, { bool centerVertically = true, bool centerHorizontally = true, bool checkBootstrapClasses = true, })

Sets div as centered content, using display property as table and sub div elements display property as table-cell.

Implementation

void setDivCentered(DivElement div,
    {bool centerVertically = true,
    bool centerHorizontally = true,
    bool checkBootstrapClasses = true}) {
  div.style.display =
      isInlineElement(div, checkBootstrapClasses: checkBootstrapClasses)
          ? 'inline-table'
          : 'table';

  div.classes.removeAll(_divCenteredBootstrapConflictingClasses);

  var subDivs = div.querySelectorAll(':scope > div');

  for (var subDiv in subDivs) {
    print(subDiv.outerHtml);

    subDiv.classes.removeAll(_divCenteredBootstrapConflictingClasses);
    subDiv.style.display = 'table-cell';

    if (centerHorizontally) {
      subDiv.style.textAlign = 'center';
    }

    if (centerVertically) {
      subDiv.style.verticalAlign = 'middle';
    }

    var contentDivs = subDiv.querySelectorAll(':scope > div');

    for (var contentDiv in contentDivs) {
      if (!isInlineElement(contentDiv as DivElement,
          checkBootstrapClasses: checkBootstrapClasses)) {
        contentDiv.style.display = 'inline-block';
      }
    }
  }
}