Foros del Web » Creando para Internet » HTML »

Como centrar un DIV?

Estas en el tema de Como centrar un DIV? en el foro de HTML en Foros del Web. Hola, veréis, tengo el siguiente código: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código HTML: Ver original < div class = "hls" style = "text-align: center;" >       ...
  #1 (permalink)  
Antiguo 07/05/2011, 13:52
 
Fecha de Ingreso: abril-2011
Mensajes: 85
Antigüedad: 6 años, 8 meses
Puntos: 5
Como centrar un DIV?

Hola, veréis, tengo el siguiente código:

Código HTML:
Ver original
  1. <div class="hls" style="text-align: center;">
  2.                    
  3.                   <p><span class="ttlhs">Doce</span><br />
  4.                       <span class="superfont Estilo38">12</span><span class="month"> /unidad</span></p>
  5.                 </div>

Y necesito que este se me centre en el DIV, pero no se queda centrado, he probado también haciendo esto:

Código HTML:
Ver original
  1. <div class="hls" style="text-align: center;">
  2.                    
  3.                   <p><span class="ttlhs" style="text-align: center;">Doce</span><br />
  4.                       <span class="superfont Estilo38" style="text-align: center;">12</span><span class="month"> /unidad</span></p>
  5.                 </div>

Pero tampoco funciona... espero que me podais echar un cable.
Gracias!
  #2 (permalink)  
Antiguo 07/05/2011, 15:32
(Desactivado)
 
Fecha de Ingreso: abril-2011
Mensajes: 153
Antigüedad: 6 años, 7 meses
Puntos: 236
Respuesta: Como centrar un DIV?

Hola!
Mira están las siguientes formas fáciles de hacerlo:

1.
Código HTML:
<center>
<div> 
CONTENIDO DEL ELEMENTO
</div>
</center> 
2.
Código HTML:
<table align="center">
<tr><td>
<div> 
CONTENIDO DEL ELEMENTO
</div>
</td></tr>
</table> 
3.
Código HTML:
<div style="width:200px;margin:auto;"> 
CONTENIDO DEL ELEMENTO
</div> 
Ahora un detalle para cada forma usada:
  1. Elemento <center> - Lamentablemente ésta etiqueta ya es obsoleta para los doctype modernos pero aún sigue funcionando.
  2. Atributo align - También ya es obsoleta pero sigue funcionando.
  3. Propiedad margin - Efectivamente ésta propiedad de CSS es la actualmente usada para centrar elementos y es la que yo te recomiendo para que tus documentos sean válidos para los doctype modernos.

Bueno básicamente sólo usa margin y usando el valor auto para que se distribuya el elemento correctamente.

Saludos!
  #3 (permalink)  
Antiguo 08/05/2011, 03:49
Avatar de tasel  
Fecha de Ingreso: mayo-2011
Mensajes: 22
Antigüedad: 6 años, 7 meses
Puntos: 3
Respuesta: Como centrar un DIV?

Para centrar un div, mejor en CSS:
Código CSS:
Ver original
  1. .h1s{
  2.    width:200px;
  3.    margin:0 auto;
  4. }
Para centrar el contenido de un div (lo que hay dentro, no el div en si), debería servir con text-align:center; También mejor en CSS:
Código CSS:
Ver original
  1. .h1s{
  2.   text-align:center;
  3. }
  #4 (permalink)  
Antiguo 09/05/2011, 17:29
(Desactivado)
 
Fecha de Ingreso: abril-2011
Mensajes: 153
Antigüedad: 6 años, 7 meses
Puntos: 236
Respuesta: Como centrar un DIV?

tasel
Cita:
...
3.
Código HTML:
Ver original
  1. <div style="width:200px;margin:auto;">
  2. CONTENIDO DEL ELEMENTO
  3. </div>
Ahora un detalle...
-.-!!!
  #5 (permalink)  
Antiguo 10/05/2011, 14:20
Avatar de tasel  
Fecha de Ingreso: mayo-2011
Mensajes: 22
Antigüedad: 6 años, 7 meses
Puntos: 3
Respuesta: Como centrar un DIV?

Hacerlo en CSS es más ordenado, así tienes la estructura en un lado y el estilo en otro. Mezclar ambos puede acabar siendo un lío tremendo.
Mi recomendación es no usar style nunca a menos que no puedas usar CSS.

Etiquetas: Ninguno
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 13:05.