Foros del Web » Creando para Internet » CSS »

Boton DIV + CSS

Estas en el tema de Boton DIV + CSS en el foro de CSS en Foros del Web. Necesito su ayuda mi inconveniente es el siguiente: Necesito hacer un Botón, dentro de un DIV con la menor línea de código posible. El tamaño ...
  #1 (permalink)  
Antiguo 03/02/2012, 07:39
 
Fecha de Ingreso: febrero-2012
Mensajes: 19
Antigüedad: 12 años, 2 meses
Puntos: 0
Boton DIV + CSS

Necesito su ayuda mi inconveniente es el siguiente:

Necesito hacer un Botón, dentro de un DIV con la menor línea de código posible.

El tamaño del DIV debe ser de 192*102px. Debe decir:

"Ingreso a Curso


Ingresar"

Las palabras deben ser los enlaces.
Otra consulta es: Que puedo usar a mas allá de padding para mover el texto dentro del div para acomodarlo según mis necesidades.

Saludos y Gracias!
  #2 (permalink)  
Antiguo 03/02/2012, 07:44
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 10 meses
Puntos: 269
Respuesta: Boton DIV + CSS

Hola.
Cita:
Iniciado por juanpablosolari Ver Mensaje
Necesito hacer un Botón, dentro de un DIV con la menor línea de código posible.
Hacelo y luego lo optimizamos.
Cita:
Iniciado por juanpablosolari Ver Mensaje
Que puedo usar a mas allá de padding para mover el texto dentro del div para acomodarlo según mis necesidades.
probá con las propiedades text-align, line-height y position

Saludos.
  #3 (permalink)  
Antiguo 03/02/2012, 07:48
 
Fecha de Ingreso: febrero-2012
Mensajes: 19
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: Boton DIV + CSS

Intente, pero no, se que algo estoy haciendo mal. Te paso el codigo.

Cita:
.ic{
width:192px;
height:102px;
position:relative;
margin:auto;
padding-top:10px;
padding-left:10px;
background-color:#005785;
font-size:18px;
color:#FFF;
}

.fuenteic{text-decoration:none;
font-family:Arial, Verdana, sans-serif;
}

.fuenteic:link{color:#FFF}
.fuenteic:visited{color:#e3efff}
.fuenteic:hover{color:#e3efff; text-decoration: underline}
.fuenteic:active{color:#FFF}
Cita:
<div class="ic"><a href="#" class="fuenteic">Inscripcion a cursos</a></div>
Gracias!!
  #4 (permalink)  
Antiguo 03/02/2012, 07:50
Avatar de cluster28  
Fecha de Ingreso: enero-2008
Ubicación: Donostia - San Sebastián
Mensajes: 756
Antigüedad: 16 años, 3 meses
Puntos: 32
Respuesta: Boton DIV + CSS

Código CSS:
Ver original
  1. #div_a_medida{height:102px;width:102px;}

Código HTML:
Ver original
  1. <div id="div_a_medida"><span>Ingreso a Curso</span><form action="pagina.php"><input type="text" name="boton" value="Ingresar"></input></form></div>

Este ejemplo es con botón. Si quieres enlaces es de otro modo. No te entiendo bien.

Si no va bien es que algo he escrito mal, no lo he probado.

El padding lo puedes aplicar a la etiqueta div y separa el botón del border del div por dentro, o puedes usar el margin sobre la etiqueta del botón para separarlo del div por fuera.
  #5 (permalink)  
Antiguo 03/02/2012, 08:01
 
Fecha de Ingreso: febrero-2012
Mensajes: 19
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: Boton DIV + CSS

Cita:
Iniciado por cluster28 Ver Mensaje
Código CSS:
Ver original
  1. #div_a_medida{height:102px;width:102px;}

Código HTML:
Ver original
  1. <div id="div_a_medida"><span>Ingreso a Curso</span><form action="pagina.php"><input type="text" name="boton" value="Ingresar"></input></form></div>

Este ejemplo es con botón. Si quieres enlaces es de otro modo. No te entiendo bien.

Si no va bien es que algo he escrito mal, no lo he probado.

El padding lo puedes aplicar a la etiqueta div y separa el botón del border del div por dentro, o puedes usar el margin sobre la etiqueta del botón para separarlo del div por fuera.
Es mas simple que esto, es solo un enlace... Podrias darme codigo como si fuera un enlace?

Gracias capoooo!
  #6 (permalink)  
Antiguo 03/02/2012, 08:04
Avatar de cluster28  
Fecha de Ingreso: enero-2008
Ubicación: Donostia - San Sebastián
Mensajes: 756
Antigüedad: 16 años, 3 meses
Puntos: 32
Respuesta: Boton DIV + CSS

Si lo tienes casi hecho:

El href tiene que ir a algún lado, # no lleva a ningún sitio. # se suele usar con javascript o jquery.

Código HTML:
Ver original
  1. <a href="pagina_incripcion.php">Inscripcion a cursos</a>
  #7 (permalink)  
Antiguo 03/02/2012, 08:15
 
Fecha de Ingreso: febrero-2012
Mensajes: 19
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: Boton DIV + CSS

Cita:
Iniciado por cluster28 Ver Mensaje
Si lo tienes casi hecho:

El href tiene que ir a algún lado, # no lleva a ningún sitio. # se suele usar con javascript o jquery.

Código HTML:
Ver original
  1. <a href="pagina_incripcion.php">Inscripcion a cursos</a>
Ya lo se, solo es para probar como queda.

A ver si entendí entonces:

Cita:
<div class="div_a_medida">
<a href="pagina_incripcion.php">Inscripcion a cursos</a>
<a href="pagina_incripcion.php">Ingresar</a>
</div>
Cita:
.div_a_medida{height:102px;width:102px;}
¿Ahora como le doy estilo a los enlaces?
Si los muevo dentro del DIV con padding se me deforma el tamaño del mismo.
  #8 (permalink)  
Antiguo 03/02/2012, 09:04
Avatar de cluster28  
Fecha de Ingreso: enero-2008
Ubicación: Donostia - San Sebastián
Mensajes: 756
Antigüedad: 16 años, 3 meses
Puntos: 32
Respuesta: Boton DIV + CSS

Dales un id o una clase a las etiquetas a y usa margin, así no se te deformara el div

Etiquetas: tamaño, botones
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 05:53.