как сделать пространство в промежутке

Я пытаюсь установить цвет фона для пробелов в пределах диапазона. Но он не будет отображаться, когда промежуток пробела окажется в точке, когда линия обертывается.

HTML

asdfghjklkqowbvaa<span> </span>a

CSS

body {
  font-family: monospace;
  font-size: 40px;
}

span {
  background-color: black;
}

JSFIDDLE

Ответ 1

Измените свой CSS для диапазона, чтобы показывать пробелы, как в <pre>. Взгляните на различные варианты белого пространства

span {
    background-color: black;
    white-space:pre;
}

Из упомянутого ресурса вот хорошая таблица, что будут делать различные варианты для white-space:

               New lines    Spaces and tabs   Text wrapping
normal         Collapse     Collapse          Wrap
pre            Preserve     Preserve          No wrap
nowrap         Collapse     Collapse          No wrap
pre-wrap       Preserve     Preserve          Wrap
pre-line       Preserve     Collapse          Wrap

Если вы добавите   к вашему диапазону, строка больше не сломается на вашем пространстве, а вместо этого "склеивает" две части вместе, не обертывая строку на пробел.