Foros del Web » Creando para Internet » CSS »

No sé como centra una imágen dentro de article

Estas en el tema de No sé como centra una imágen dentro de article en el foro de CSS en Foros del Web. Buenas, Lo que quiero conseguir es centrar una imagen una imagen. Las dimensiones del section son 1024 x 350. Quisiera que article heredara dichas dimensiones, ...
  #1 (permalink)  
Antiguo 17/07/2014, 03:03
 
Fecha de Ingreso: enero-2002
Ubicación: Sabadell
Mensajes: 565
Antigüedad: 20 años, 10 meses
Puntos: 4
No sé como centra una imágen dentro de article

Buenas,
Lo que quiero conseguir es centrar una imagen una imagen.
Las dimensiones del section son 1024 x 350.
Quisiera que article heredara dichas dimensiones, pero sólo hereda el ancho, el alto es 147, que es la altura de la imagen más el margin

Código HTML:
Ver original
  1.         <article id="index">
  2.             <img id="index" src='img/retol.png'/>
  3.         </article>
  4.     </section>

Código CSS:
Ver original
  1. section{
  2.     width:100%;
  3.     min-height:350px;
  4.     overflow:hidden;
  5.     background:#BABABA;
  6.     float:left;
  7. }
  8.  
  9. section article#index{
  10.     width:100%;
  11.     height:100%;
  12.     margin:0 auto;
  13. }

No sé si debería poner un div dentro de article. La verdad es que me lío.

Gracias
__________________
Qué fácil cuando lo sabes y qué difícil cuando no
  #2 (permalink)  
Antiguo 19/07/2014, 20:59
 
Fecha de Ingreso: noviembre-2012
Mensajes: 139
Antigüedad: 10 años
Puntos: 1
Respuesta: No sé como centra una imágen dentro de article

pues primero que todo usar 2 id para distintos elementos esta mal,
intenta esto
Código HTML:
Ver original
  1.         <article>
  2.             <img id="index" src='img/retol.png'/>
  3.         </article>

Código CSS:
Ver original
  1. section{
  2.     width:100%;
  3.     min-height:350px;
  4.     overflow:hidden;
  5.     background:#BABABA;
  6. }
  7.  
  8. section article{
  9.     width:900px;
  10.     height:100%;
  11.     margin:0 auto;
  12. }
  13. section article #index{
  14.     width:450px;
  15.     height:100%;
  16.     margin:0 auto;
  17. }

si te va funcionando ve variando el ancho asta que quede como te guste.
espero te sirva
  #3 (permalink)  
Antiguo 20/07/2014, 16:11
 
Fecha de Ingreso: mayo-2013
Mensajes: 207
Antigüedad: 9 años, 6 meses
Puntos: 31
Respuesta: No sé como centra una imágen dentro de article

¿De dónde va a heredar el height? Si no lo declaras tomara el valor por defecto (auto) el 100% de auto es auto.

Las imagenes es elemento inline, por lo que se centra como el texto.

Etiquetas: article, background, imágen, width
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:30.