<p class="normal">Lorem, ipsum dolor      sit amet consectetur adipisicing elit. Soluta nobis quidem, cumque illum culpa
        dolorem tenetur vitae commodi in     expedita libero placeat cupiditate enim distinctio         nesciunt minima dolor
        pariatur         ducimus?</p>
<p class="nowrap">Lorem, ipsum dolor      sit amet consectetur adipisicing elit. Soluta nobis quidem, cumque illum culpa
        dolorem tenetur vitae commodi in     expedita libero placeat cupiditate enim distinctio         nesciunt minima dolor
        pariatur         ducimus?</p>
<p class="pre">Lorem, ipsum dolor      sit amet consectetur adipisicing elit. Soluta nobis quidem, cumque illum culpa
        dolorem tenetur vitae commodi in     expedita libero placeat cupiditate enim distinctio         nesciunt minima dolor
        pariatur         ducimus?</p>
<p class="pre-wrap">Lorem, ipsum dolor      sit amet consectetur adipisicing elit. Soluta nobis quidem, cumque illum culpa
        dolorem tenetur vitae commodi in     expedita libero placeat cupiditate enim distinctio         nesciunt minima dolor
        pariatur         ducimus?</p>
<p class="pre-line">Lorem, ipsum dolor      sit amet consectetur adipisicing elit. Soluta nobis quidem, cumque illum culpa
        dolorem tenetur vitae commodi in     expedita libero placeat cupiditate enim distinctio         nesciunt minima dolor
        pariatur         ducimus?</p>
.normal {
  white-space: normal;
}

.nowrap {
  white-space: nowrap;
}

.pre {
  white-space: pre;
}

.pre-wrap {
  white-space: pre-wrap;
}

.pre-line {
  white-space: pre-line;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.