Nueva pregunta

Pregunta:

 
  0  
 
Fecha: 03-03-2018 22:07:58 (En Español)

Centrar <Div> y contenido[Resuelta]

Hola, estoy creando una página para que me muestre un mensaje, pero hay una parte que no consigo centrar, a ver si me podéis ayudar con el código.

<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="UTF-8">
	<title>Error</title>
	<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
 <style type="text/css">
         .texto4{
	          font-size:45px; 
	          text-shadow: 2px 2px  10px black, 0 0 0 white, 0 0 0.2em grey; color: black;
	          margin-top: 0px;
	          margin-bottom: 0px;
            }
         .contenedor{
			width:500px;
			height:300px;
			line-height:300px;
			border:1px solid;
			text-align:center;
    		}
		.contenedor>span {
			display:inline-block;
			vertical-align:middle;
			line-height:normal;
			}
		.linea {
			  margin:0px 20px;
			  width:90px;    
			  border-top:1px solid #999;
			  position: relative;
			  top:10px;
			  float:left;
			  }
		.leyenda {
			  font-weight:bold;
			  float:left;
			 }

    </style>
	</head>
<body>
<center>

	<div class='contenedor'>
	        <span class="texto4">Documento <br> no <br> encontrado</span>
	</div>

<div style="width:400px;margin:auto;">
	<div class="linea">&nbsp;</div>
	<div class="leyenda">Informar</div>
	<div class="linea">&nbsp;</div>
</div>

</center>
</body>
</html>




el primer <div> se muestra centrado, pero arriba, intento que se muestre centrado tanto vertical como horizontal
y el segundo <div> igual pero debajo del primero, lo que me pasa es que si lo centro texto "Informar" sale centrado, pero las líneas ya no salen a los lados, si no arriba y abajo.


Un saludo.
Etiquetas: HTML5 canvas Votos: 0 - Respuestas: 6 - Vistas: 14 Compartir en: Google Facebook Twitter LinkedIn Link
 

Respuestas:

  • Fecha: 04-03-2018 04:28:07 Hola buenos dias, te adjunto el código:

    <!DOCTYPE html>
    <html lang="es">
    <head>
        <meta charset="UTF-8">
        <title>Error</title>
        <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
     <style type="text/css">
             .texto4{
                  font-size:45px; 
                  text-shadow: 2px 2px  10px black, 0 0 0 white, 0 0 0.2em grey; color: black;
                  margin-top: 0px;
                  margin-bottom: 0px;
                }
             .contenedor{
                width:500px;
                height:300px;
                line-height:300px;
                border:1px solid;
                text-align:center;
             }
            .contenedor>span {
                display:inline-block;
                vertical-align:middle;
                line-height:normal;
             }
            .linea {
                margin:0px 20px;
                width:28%;    
                border-top:1px solid #999;
                position: relative;
                top:15px;
                float:left;
             }
             .contenedor_leyenda{
                width:500px;
                height:40px;
                line-height:40px;
                text-align:center;
             }
            .leyenda {
                width: 28%;
                font-weight:bold;
                float:left;
             }
        </style>
        </head>
    <body >
       <center>
          <div class='contenedor'>
             <span class="texto4">Documento <br> no <br> encontrado</span>
          </div>
          <div class="contenedor_leyenda">
             <div class="linea">&nbsp;</div>
             <div class="leyenda">Informar</div>
             <div class="linea">&nbsp;</div>
          </div>
       </center>
    </body>
    </html>
    
      Votos: 2 - Link respuesta
     
  •  
      0  
     
    Fecha: 04-03-2018 08:03:39 Muchas gracias Renny, vi tu mensaje desde el móvil y estaba deseando llegar a casa para probarlo, ahora si sale bien.

    Lo dicho, muchas gracias.
      Votos: 0 - Link respuesta
     
  • Fecha: 04-03-2018 09:53:36 Al contrario. Saludos y buen domingo!   Votos: 0 - Link respuesta
     
  • Fecha: 04-03-2018 09:54:11 Por cierto, un comentario, si usaras bootstrap seria mas sencillo ;)   Votos: 1 - Link respuesta
     
  •  
      0  
     
    Fecha: 05-03-2018 06:53:02 Gracias Renny, de todas formas no creas que me decido a crear paginas web, son cuatro cosas que voy haciendo para hacer algo mas agradable de llevar el trabajo, en cuando a documentación, pero es solo para uso personal.


    Salu2.
      Votos: 0 - Link respuesta
     
  • Fecha: 05-03-2018 07:16:47 Super, me alegro mucho, estoy a tus ordenes.   Votos: 0 - Link respuesta
     
Para participar activamente de la comunidad primero debes autenticarte, ingresa al sistema.Iniciar Sesión
 
frjcbbae garagebible.com