white-space 「スペース・改行の表示方法」

<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_white-space_normal{
  white-space : normal;
}
.css_white-space_nowrap{
  white-space : nowrap;
}
.css_white-space_pre{
  white-space : pre;
}
.css_white-space_pre-wrap{
  white-space : pre-wrap;
}
.css_white-space_pre-line{
  white-space : pre-line;
}

<!-- html -->
<div class="common">

  <div class="cssTitle">white-space : normal;</div>
  <div class="css_white-space_normal">
white-spaceサンプル
３つの連続スペース   ２つの連続スペース １つのスペース① １つのスペース② １つのスペース③ END
  </div>

  <div class="cssTitle">white-space : px;</div>
  <div class="css_white-space_nowrap">
white-spaceサンプル
３つの連続スペース   ２つの連続スペース １つのスペース① １つのスペース② １つのスペース③ END
  </div>

  <div class="cssTitle">white-space : em;</div>
  <div class="css_white-space_pre">
white-spaceサンプル
３つの連続スペース   ２つの連続スペース １つのスペース① １つのスペース② １つのスペース③ END
  </div>

  <div class="cssTitle">white-space : em;</div>
  <div class="css_white-space_pre-wrap">
white-spaceサンプル
３つの連続スペース   ２つの連続スペース １つのスペース① １つのスペース② １つのスペース③ END
  </div>

  <div class="cssTitle">white-space : em;</div>
  <div class="css_white-space_pre-line">
white-spaceサンプル
３つの連続スペース   ２つの連続スペース １つのスペース① １つのスペース② １つのスペース③ END
  </div>

</div>