Autor Tema: CSS HTML ¿Cómo poner varios separadores hr en la misma linea? Distintos colores  (Leído 3371 veces)

LoboBlanco

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 25
    • Ver Perfil
Hola  :)

Quiero hacer un contador de respuestas correctas e incorrectas.

En principio he pensado hacerlo con 3 hr

Uno sería solo el borde, sin relleno (total de respuestas), otro con relleno rojo (respuestas incorrectas) y otro verde (respuestas correctas)

las 3 lineas gruesas /separadores estarían en la misma linea.

Código: [Seleccionar]
<html>
<head>
<title>Lineas con hr</title>
</head>
<body>
  <hr style="height:10px; color: black; width: 100px">
  <hr style="height:10px; color: black; background-color: green; width: 100"/>
  <hr style="height:10px; color: black; background-color: red; width: 100px">
</body>
</html>

Pero no consigo que hr no haga un salto de linea.

¿Alguien podría decirme como puedo conseguir que hr no haga salto de linea?

Muchas gracias  :)
« Última modificación: 14 de Mayo 2017, 19:58 por Alex Rodríguez »

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Html+php - ¿Cómo poner varios separadores hr en la misma linea?
« Respuesta #1 en: 21 de Marzo 2017, 00:26 »
Buenas LoboBlanco.

Podrías usar algo como esto:
Código: [Seleccionar]
<style type="text/css">
hr {
display: inline-block;
}
</style>


Saludos. ;D

LoboBlanco

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 25
    • Ver Perfil
Re:CSS. ¿Cómo poner varios separadores hr en la misma linea?
« Respuesta #2 en: 21 de Marzo 2017, 15:45 »
Muchas gracias Pedro

Funciona estupendamente   :)

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".