Заполнение не работает в горизонтальной строке css html

Я хочу добавить отступы в свой час,

hr {
  padding-left: 200px;
  
}

но это не работает. как добавить отступы в мой час?

Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Введение в технологический стек Twitch
Введение в технологический стек Twitch
В этой статье мы подробно рассмотрим стек Twitch, который подразделяется на следующий набор технологий:
8 полезных HTML-тегов, которые лучше использовать вместо <div>
8 полезных HTML-тегов, которые лучше использовать вместо <div>
Когда я только начинал изучать html, я использовал div для всего, это был один из первых тегов, которые я выучил, и казалось, что он работает в любой...
HTML5: API локального хранилища (Local Storage)
HTML5: API локального хранилища (Local Storage)
LocalStorage - это простой способ хранения данных в браузере пользователя.
Доступность HTML - программирование с инклюзивной перспективой
Доступность HTML - программирование с инклюзивной перспективой
Представьте, что вы хотите поехать на пляж. Представьте, что вы упорно трудились весь год и заслужили это. Прибыв на место, вы обнаруживаете, что...
Именование классов CSS: Конвенция именования BEM
Именование классов CSS: Конвенция именования BEM
Сопровождаемость кода, сама по себе, является пульсирующим эффектом нескольких факторов. Когда часть программного обеспечения читабельна, ясна,...
2
0
47
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

Заполнение не работает в hr.

Вместо этого вы должны использовать margin:

hr {

margin-left: 200px;

}

И это сработает.

Хорошо, спасибо за быстрый ответ

user19136007 17.05.2022 14:13

@ user19136007, пожалуйста, примите мой ответ, если вы считаете его правильным. Это галочка в моем ответе.

Python 17.05.2022 14:13

Хорошо, я сделаю это

user19136007 17.05.2022 14:14

Прокладка работает на час. Но браузер не может отображать его должным образом, пока вы не измените ширину вашего hr. Кроме того, отступы и поля - это две разные вещи. Op хочет добавить отступ, а не поле.

Vishal Kalansooriya 17.05.2022 14:20

@VishalKalansooriya, он также никогда не говорил, что хочет изменить ширину, поэтому маржа кажется лучшим способом

Cédric 17.05.2022 14:34

@Cédric Он сказал, что «я хочу добавить отступы в свой час», а не поля. Это две разные вещи

Vishal Kalansooriya 17.05.2022 16:10

@VishalKalansooriya Да, действительно, но иногда вы хотите добиться чего-то определенным образом, но это не так, как вы должны. Если ему по какой-то причине абсолютно необходимо заполнение, вы ответите, что это лучший ответ, но если ему нужен пробел слева, ответ Python будет лучшим (потому что он не устанавливает ширину). оба ваших ответа полезны. Судя по тому, как он спросил, мое предположение — это marginкажется лучшее решение.

Cédric 17.05.2022 16:21

@Cédric Моя проблема в этом. «Заполнение не работает в часах». Также, если он не знает о ширине hr, он может просто установить ее через width: calc(100% - размер отступа) или что-то в этом роде

Vishal Kalansooriya 17.05.2022 17:00

Прежде чем добавлять отступы, вам нужно установить ширину для вашего hr, иначе он будет отображаться в полную ширину.

hr:first-of-type{
    width: 100px;
    padding-left: 10px;
}
hr:last-of-type{
    width: 100px;
    padding-left: 50px;
}
<hr>
<hr>

Спасибо и всего наилучшего!

HR немного отличается от большинства HTML-тегов своим определенным поведением, поскольку он пытается заполнить всю ширину содержащего его элемента.

Единственный известный мне способ остановить его расширение за любые поля - это явно установить атрибут ширина.

hr {
  width: 90%;
  padding-left: 200px;
}

Даже в этом случае кажется, что отступ игнорируется, поэтому вместо этого вы должны использовать отступ:

hr {
  width: 90%;
  margin-left: 200px;
}

Все равно как-то сумбурно и неточно. Если линейчатая линия должна быть на одной линии с каким-либо другим элементом, вам, вероятно, лучше убедиться, что они находятся в одном и том же DIV, чтобы линейчатая линия могла начинаться с левого края div.

Другие вопросы по теме