css - propiedades - Diseñando el elemento<hr/>

linea html hr color

Question

Estoy tratando de hacer que mi elemento <hr /> (hr) sea rosado, y estoy usando la siguiente regla css para esto:

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

Pero todavía hay una línea negra que lo atraviesa.

(Aquí hay un vistazo al sitio que estoy haciendo: http://www.yemon.org/ , es la única línea horizontal en el diseño.

¿Cómo consigo la línea de uniforme rosa?

Answer 1

Cambiarlo a esto:

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

Answer 2

El elemento hr está hecho de borde, por lo que es un borde simple: ninguno y se librará del exceso.

Entonces simplemente tienes que jugar en tu altura para hacerlo tan grueso como quieras.

Answer 3

Intente configurar la propiedad del color del borde: border-color: # ed1d61;

Answer 4

Mirando tu página, creo que esto se vería mejor:

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

Una demo está here .

Answer 5

Prueba esto:

.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;
}

Answer 6

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

<hr/>
sadf