Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Alinear <button> css

Estas en el tema de Alinear <button> css en el foro de CSS en Foros del Web. Hola a todos. Alguien que pueda ayudarme a alinear verticalmente estos tres <button> Quiero que los tres queden alineados y no puedo hacerlo. Una ayudita? ...
  #1 (permalink)  
Antiguo 23/05/2013, 22:31
 
Fecha de Ingreso: mayo-2012
Ubicación: Mar del Plata
Mensajes: 157
Antigüedad: 7 años, 7 meses
Puntos: 0
Alinear <button> css

Hola a todos.

Alguien que pueda ayudarme a alinear verticalmente estos tres <button>




Quiero que los tres queden alineados y no puedo hacerlo. Una ayudita?

Gracias.
  #2 (permalink)  
Antiguo 24/05/2013, 00:28
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 7 meses
Puntos: 16
Respuesta: Alinear <button> css

Me imgaino que simplemente debes tener los tres <button> seguidos sin mas.
Hay varias formas, te digo dos y tu pruebas:

1.- Los pones los tres dentro un div, talcual:
Código HTML:
Ver original 
Y a ese div le das de anchura lo que un boton, tecnicamente asi deberia bastar, pero como esta opcion no la he probado nunca te dejo otra solucion:

2.- Lo de siempre, una listita, <ul><li>, dentro de cada <li> pones el <button> y a los li les pones list-style none y float left. Esto si ha de funcionar 100% seguro.

Ya me diras que tal te funciono todo!
  #3 (permalink)  
Antiguo 24/05/2013, 10:46
 
Fecha de Ingreso: mayo-2012
Ubicación: Mar del Plata
Mensajes: 157
Antigüedad: 7 años, 7 meses
Puntos: 0
Respuesta: Alinear <button> css

Hola, mira lo puse asi pero sigue sin alinearse.

Código HTML:
Ver original
  1. <ul>
  2. <li style="list-style:none; float:left;">
  3. <button style="height:65px; width:270px; text-align:left; background: url('../img/icon/servidor.png') 12px no-repeat;"><span style="color:#000; text-align:left; padding-left:40px; font-weight: bold;">Servidor</span><BR><span style="font-size:11px; padding-left:40px; color:#1d1d1d;">Enciende, Apaga y Reinicia tu servidor.</span></button>
  4. </li>
  5.  
  6. <li style="list-style:none; float:left;">
  7. <button style="height:65px; width:270px; text-align:left; background: url('../img/icon/config.png') 12px no-repeat;"><span style="color:#000; text-align:left; padding-left:40px; font-weight: bold;">Configuracion</span><BR><span style="font-size:11px; padding-left:40px; color:#1d1d1d;">Configuracion basica de tu servidor.</span></button>
  8. </li>
  9.  
  10. <li style="list-style:none; float:left;">
  11. <button style="height:65px; width:270px; text-align:left; background: url('../img/icon/firewall.png') 12px no-repeat;"><span style="color:#000; text-align:left; padding-left:40px; font-weight: bold;">Firewall</span><BR><span style="font-size:11px; padding-left:40px; color:#1d1d1d;">Administra los bloqueos.</span></button>
  12. </li>
  13.  
  14. </ul>

gracias
  #4 (permalink)  
Antiguo 24/05/2013, 10:49
 
Fecha de Ingreso: mayo-2012
Ubicación: Mar del Plata
Mensajes: 157
Antigüedad: 7 años, 7 meses
Puntos: 0
Respuesta: Alinear <button> css

Me di cuenta que tenia un with mal puesto entonces no me dejaba alinear los button pero ya esta muchas gracias me sirvio!

Etiquetas: alinear, button
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 13:16.