Стилизация элемента <hr/">

Я пытаюсь сделать мой элемент <hr /> (hr) розоватым, и для этого я использую следующее правило css:

hr {height: 1px; color: #ed1d61;background-color: #ed1d61;
}

Но до сих пор есть черная линия.

(вот посмотрите на него на сайте, который я делаю: http://www.yemon.org/, его единственная горизонтальная линия в дизайне.

Как получить линию однородной розовой?

Ответ 1

Измените его так:

hr {
    height: 1px;
    color: #ed1d61;
    background: #ed1d61;
    font-size: 0;
    border: 0;
}

Ответ 2

Глядя на вашу страницу, я думаю, что это будет выглядеть лучше:

hr {height: 2px;
    background-color: #ed1d61;
    border:none
}

Демо здесь.

Ответ 3

Попробуйте установить свойство цвета границы: border-color: # ed1d61;

Ответ 4

Элемент hr сделан из границы, поэтому простая граница: нет, и вы избавитесь от избытка.

Тогда вам просто нужно играть на высоте, чтобы сделать ее такой же толстой, как хотелось бы.

Ответ 5

Попробуйте следующее:

.hr {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0)); 
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0)); 
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0)); 
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0)); 
    margin: 25px;
}

Ответ 6

hr{
    background-color: #ed1d61;
    border-width: 0;
    /*change your size in this place*/
    padding-top: 1px;
}

<hr/>
sadf