CSS - Линия * по всей ширине экрана

Question

Мне нужно сделать линию из * что бы адаптировалось по всей ширине экрана

Answer 1

Сделайте такую линию максимально длинной (чтобы хватало для самых больших экранов), поместите её внутри блока-обёртки и задайте этому блоку overflow: hidden. Тогда визуально будет казаться, что она адаптируется (а на самом деле будет видна только какая-то её часть):

.line-wrap {
  padding: 20px 0;
  overflow: hidden;
  white-space: nowrap;
}

<div class="line-wrap">
************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************
</div>

Answer 2

.test {
  height: 7px;
  background-position: left;
  background-repeat: repeat;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHBAMAAAA2fErgAAAAJFBMVEX///+KioowMDBAQEAMDAxiYmLm5ubMzMxQUFC2trYiIiIAAAA2IPbUAAAAAXRSTlMAQObYZgAAACVJREFUCB1jYAADLiDJNaOKgYEtpIGBgcO4mYGBk4kTKMjIwAAAMvcC1AqHZy8AAAAASUVORK5CYII=');
}

<div class="test"></div>

БЛОГ НА HUSL

CSS - Линия * по всей ширине экрана

Ответы (2 шт):