Sectioned list

List with floated elements sectioned with li-elements containing a horizontal line

HTML

<!DOCTYPE html>
<html>

  <head>
    <title>Sectioned List</title>
  </head>

  <body>
    <ul class="sortable">
      <li class="item">item 1</li>
      <li class="item">item 2</li>
      <li class="break">
        <hr>
      </li>
      <li class="item">item 3</li>
      <li class="item">item 4</li>
      <li class="break">
        <hr>
      </li>
      <li class="item">item 5</li>
    </ul>
  </body>

</html>

CSS

.sortable li {
  display: block;
}

.item {
  min-width: 150px;
  border: 1px solid black;
  margin-right: 15px;
  padding: 5px;
  float: left;
}

.break {
  width: 25%;
  clear: both;
  padding: 10px;
}