HTML - ayuda para centrar imagen

 
Vista:
Imágen de perfil de Hernan
Val: 6
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por Hernan (3 intervenciones) el 16/04/2020 00:55:09
Hola, estoy teniendo dificultades para centrar esta imagen en el home de mi pagina


imagen

cual podria llegar a ser el error?


gracias?
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de joel
Val: 1.453
Oro
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por joel (460 intervenciones) el 16/04/2020 13:46:29
Puedes mostrar el código para poder ayudarte?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Hernan
Val: 6
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por Hernan (3 intervenciones) el 16/04/2020 22:27:34
Hola Joel!

te dejo la linea de codigo y su respectivo css

html:

1
2
3
<div class="contenido">
    <img class="escalera" src="./resources/image/IMG_6824.jpg" alt="">
</div>


css

1
2
3
4
5
6
7
.contenido{
 
    background-color: white;
       width: 50%;
       padding: 40px;
       margin: 100px auto;
}

muchas gracias!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de joel
Val: 1.453
Oro
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por joel (460 intervenciones) el 17/04/2020 10:56:35
Hola Hernan, si yo cojo únicamente tu código me queda completamente centrado!!!

Prueba-lo tu mismo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
    .contenido{
        background-color: white;
        width: 50%;
        padding: 40px;
        margin: 100px auto;
    }
    </style>
</head>
 
<body>
 
<div class="contenido">
    <img class="escalera" src="./resources/image/IMG_6824.jpg" alt="">
</div>
 
<body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de ScriptShow
Val: 359
Bronce
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por ScriptShow (409 intervenciones) el 18/04/2020 10:48:22
Saludos,

si necesitas un centrado responsive, adaptable, prueba a ver:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
 
<html>
<head>
<meta charset="utf-8">
<style>
.escalera {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
padding: 40px;
max-width: 80%;
max-height: 80%;
background-color: white;
}
</style>
</head>
<body>
<div class="contenido">
<img class="escalera" src="./resources/image/IMG_6824.jpg" alt="">
</div>
<body>
</html>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Hernan
Val: 6
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

ayuda para centrar imagen

Publicado por Hernan (3 intervenciones) el 20/04/2020 20:19:11
muchas gracias, ahora si me aparece centrado.


hay alguna razon por la cual el codigo original me aparecia justificado a la izquierda? no termino de entender por que resulta de esa manera

saludos!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar