html html5 css read more break divider section

readmore.html

<!-- Pure HTML5 CSS simple "Read More" break to hide all elements after a clickable section-->

<style>
label.more {
  display: inline-block;
  width: 100%;
  border-bottom: 1px solid black;
  text-align: center;
}

label.more+input:checked ~ * {
display: none;
}

label.more+input {
  visibility: hidden;
  max-height: 0px;
}
</style>

<div>
  <p>Before Break</p>
  <label for="box" class="more">
        <a class="button">
          Read More...
        </a>  
  </label>  
  <input id="box" value="true" type="checkbox"/>
  <p>After Break</p>
  <p>More Stuff</p>
</div>
<p>Outside Div</div>

ertyuio