CSS Responsive Hanging List Indents

type.scss

// Creates hanging indents for unordered list, without the need of defining a width or negative margin for the li:marker
.list-hanging {
  margin: 0;
  padding: 0;
  list-style: none;
  display: table;
  > li {
    display: table-row;
  }
  > li:before {
    padding-right: 1em;
    display: table-cell;
  }
}

ul.list-hanging > li:before {
  content: "\2022";
}

ol.list-hanging {
  counter-reset: nested_ol;
  > li {
    counter-increment: nested_ol;
  }
  > li:before {
    content: counters(nested_ol, ".") ".";
  }
}