Как добавить отступы / подобный эффект к границе HTML

Question

Как добавить отступы / подобный эффект к границе HTML

0

У меня есть эта строка

<div class="fixedwidthDiv HRSeparator"></div>

во всем html-коде, который я унаследовал. Он отделяет абзацы текста. Я хочу добавить дополнение 15px слева и справа к этой горизонтальной линии, так как я использую класс bootstrap col-md-12 также добавляет это, и у меня есть

<div class="fixedwidthDiv col-md-12">

также в нескольких местах в моем html. Поэтому я хочу выровнять исходную позицию текста и горизонтальную линию.

http://jsfiddle.net/Ne5GE/1/

Kevin Bowersox 07 янв. 2014, в 11:24

Источник

Теги:

html

css

1 ответ

Ещё вопросы

Kevin Bowersox · Answer 1 · 2014-01-07T09-12-00.000Z

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

HTML

<div id="container">
<div class="fixedwidthDiv HRSeparator"></div>
    <p>This is some text that will align with the HRSeparator</p>
</div>

CSS

.container{
    margin: 0px 15px;
}
.HRSeparator {
    border-bottom: 1px solid;
    margin-bottom: 2em;
    margin-top: 2em;
}
.fixedwidthDiv {
   overflow: hidden;
   max-width: 900px;
}

JS Fiddle: http://jsfiddle.net/Ne5GE/2/