Почему же CSS не может добавить новую строку для элемента ввода? - PullRequest
Новая
       6

Почему же CSS не может добавить новую строку для элемента ввода?

0 голосов
/ 02 октября 2018

Это умный способ добавить новую строку перед каждым тегом span. 

span {
    display: inline;
}
span:before {
    content: "\a ";
    white-space: pre;
}
<p>
  First line.<span>Next line.</span> <span>Next line.</span>
</p>

Теперь так же, как и я, я хочу добавить новую строку в конце каждого элемента input, почему нет новой строки для inputэлемент? 

input{
    display:inline;
}
input::after{  
    content:"\a ";
    white-space:pre;
}

  
content:<input id="1th" type="text" >
content:<input id="3th" type="text" >
content:<input id="4th" type="text" >

1 Ответ

0 голосов
/ 03 октября 2018

Вы явно установили свойство display для своего ввода как inline.

Встроенный элемент не начинается с новой строки.

Решение :

Элемент уровня блока всегда начинается с новогострока

Измените значение свойства селектора ввода display на block. 

input{
    display:block;
}
input::after{  
    content:"\a ";
    white-space:pre;
}
content:<input id="1th" type="text" >
content:<input id="3th" type="text" >
content:<input id="4th" type="text" >

Все это не нужно , каждый элемент HTML является либо block element, либо inline element.Оказывается, элемент input является блочным элементом, что делает это объявление CSS избыточным.

...