page-break-after,page-break-before,page-break-inside「改ページの位置」

<style type="text/css">
.common div{
  font-family   : "メイリオ", sans-serif;
  width         : 290px;
  border        : 2px solid #6495ed;
  background    : #e7e7ff;
  padding       : 10px;
}
div.cssTitle {
  margin-top    : 10px;
  background    : #6495ed;
  color         : #fff;
  font-weight   : bold;
}
.css_after_always{
  page-break-after : always;
}
.css_after_left{
  page-break-after : left;
}
.css_before_always{
  page-break-before : always;
}
.css_before_right{
  page-break-before : right;
}
.css_inside_avoid{
  page-break-inside : avoid;
}

<!-- html -->
<div class="common">
  <div class="cssTitle">page-break-inside : avoid;</div>
  <div class="css_inside_avoid">
  この要素内で改ページ禁止。　～　この要素内で改ページ禁止。
  </div>

  <div class="cssTitle">page-break-after : always;</div>
  <div class="css_after_always">
  この後で改ページ
  </div>

  <div class="cssTitle">page-break-after : left;</div>
  <div class="css_after_left">
  次のページが左ページになるようにこの後で改ページ
  </div>

  <div class="cssTitle">page-break-before : always;</div>
  <div class="css_before_always">
  この前で改ページ
  </div>

  <div class="cssTitle">page-break-before : right;</div>
  <div class="css_before_right">
  次のページが右ページなるようにこの前で改ページ
  </div>
</div>