ajuste de span a tamaño de image para centrarlo

[mayid]

Tengo esta clase para elementos que quiero centrados:

.center {margin: 0 auto;} /* display: block; */

En tema es que un span sin ancho definido (y con una foto dentro) no se me alinea en el centro. Tendría que definirle un ancho para que funcione.

Esto surge a partir de que estoy modificando html, que funcionaba con esta etiqueta: <center>

Así <center> <img....> </center>

Alguna idea de como modificar esa estructura? O de como centrar el span sin ancho definido?

[alexk]

no entiendo mmmm... seria mejor ver el ejemplo andando o mas codigo... que no entiendo jeje... si quieres centrar el elemento en linea pues "text-align:center;" nuse

[mayid]

Entiendo. Por ahora lo solucioné con esto:

.center {display: block; text-align: center; width: 100%}

[caricatos]

Hola:

Los span por defecto son elementos en línea, y solo pueden centrarse dentro de bloques con text-align, o como estás haciendo, forzándolo como bloque (pero para eso es aconsejable usar un div), o dentro del bloque y si estuviera dentro de algo, ponerle los mismos márgenes (y padding'es) a ambos lados.

Pero sigo pensando en que es mejor usar una capa.

Por cierto, los tags center es preferible ir evitándolos, por estar desaconsejados, equivalen a div align="center" (aunque es mejor usar estilos)

Saludos

[mayid]

Veo. Si, usando un div, con esto basta:

.center {text-align: center;}

Lo voy a usar así! Gracias!

[alexk]

ahora ya entiendo.... que bueno que este solucionado

[daPhyre]

Imágenes, spans, y similares, son estructuras en línea que deberían ir dentro de una etiqueta en bloque como un párrafo, por lo que lo correcto sería algo así:

Código HTML:

<p style="text-align:center"><img /></p> 

Contrario a los elementos en bloque, que para ser centrados deben ser con un "margin:0 auto"