Foros del Web » Creando para Internet » CSS »

Listado y Botones con CSS

Estas en el tema de Listado y Botones con CSS en el foro de CSS en Foros del Web. Hola, Estoy haciendo una lista de hipervínculos, del tipo <li><a href="#">botón</a></li>, pero tengo un problema. Sólo aparece como hipervínculo el texto en cuestión, pero yo ...
  #1 (permalink)  
Antiguo 26/01/2010, 11:29
 
Fecha de Ingreso: enero-2010
Mensajes: 29
Antigüedad: 7 años, 11 meses
Puntos: 0
Listado y Botones con CSS

Hola,

Estoy haciendo una lista de hipervínculos, del tipo
<li><a href="#">botón</a></li>, pero tengo un problema.

Sólo aparece como hipervínculo el texto en cuestión, pero yo necesito que todo el recuadro que lo enmarca funcione como un botón. ¿Cómo puedo conseguirlo?


Adjunto los códigos:


<body id="tapiz">



<div id="despliegue">

<div id="encabz">
</div>

<div id="contenido">
<table width="100%" border="0" cellspacing="15px" id="tablagrande">
<tr>
<td id="cbotones">
<ul id="botones">
<li><a href="#">Inicio</li></a>
<li><a href="#">Quienes&nbsp;somos</a></li>
<li><a href="#">Noticias</a></li>
<li><a href="#">Descargas</a></li>
<li><a href="#">Contacto</a></li>
</ul>

</td>
<td id="ccontenido"></td>
<td id="cenlaces">&nbsp;</td>
</tr>
</table>

</div>

</div>


</body>
</html>






@charset "utf-8";

}

body {
background-color: #97BEC6;
}
#tapiz {
background-color: #97BEC6;
background-image: url(images/azul.jpg);
}



#despliegue {
background-color: #003C65;
width: 1000px;
margin: 0px auto;
height: 625px;
margin-top: 0px;
}

#encabz {
background-color: #03F;
height: 150px;
width: 980px;
margin: 0px auto;
margin-top: 10px;
padding-top: 0px;
background-image: url(images/titulo.jpg);
}

#contenido {
background-color: #FFF;
width: 980px;
margin: 0px auto;
margin-top: 30px;
height: 425px;
}
#tapiz #despliegue #contenido #tablagrande tr #cbotones {
width: 15%;
}
#tapiz #despliegue #contenido #tablagrande tr #ccontenido {
width: 65%;
}
#tapiz #despliegue #contenido #tablagrande tr #cenlaces {
width: 20%;
}
#tapiz #despliegue #contenido #tablagrande tr #cbotones #botones {
display: block;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: bold;
color: #FFF;
text-align: center;
vertical-align: middle;
list-style-position: outside;
list-style-image: none;
list-style-type: none;
margin-left: -5px;
}
#tapiz #despliegue #contenido #tablagrande tr #cbotones #botones li {
height: 20px;
padding: 5px;
background-color: #003C65;
float: none;
display: block;
margin: 10px;
text-align: center;
vertical-align: middle;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}

Adelanto que la solución no es cambiar el orden del código y poner
<a href="#"><li>botón</li></a>


Además, necesito alinear la lista a la izquierda, y lo consigo en IE con un padding, pero con Firefox y Chrome no puedo, ¿qué propiedad debo utilizar?

Muchas gracias!
  #2 (permalink)  
Antiguo 26/01/2010, 11:51
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Listado y Botones con CSS

Para empezar, borra todo tu código css, sirve de mas bien poco...

Y depues, lo consigues añadiendolo al enlace la propiedad display: block; y un padding.

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.
  #3 (permalink)  
Antiguo 26/01/2010, 11:58
 
Fecha de Ingreso: enero-2010
Mensajes: 29
Antigüedad: 7 años, 11 meses
Puntos: 0
Respuesta: Listado y Botones con CSS

Impostor!

No te entiendo!

ya he añadido dislpay:block y aunque ponga un padding, sólo cambio el tamaño del recuadro, pero el texto sigue siendo el único que funciona como un hipervínculo.

:(
  #4 (permalink)  
Antiguo 26/01/2010, 12:08
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Listado y Botones con CSS

Buenas nueve, todo tu código es un despropósito sin pies ni cabeza, así que te aconsejo que te leas el manual que en otro hilo ya te comente y partas de cero.

Este sencillo ejemplo te puede servir de guia.

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.

Última edición por Impostor; 26/01/2010 a las 14:16
  #5 (permalink)  
Antiguo 27/01/2010, 08:49
 
Fecha de Ingreso: enero-2010
Mensajes: 29
Antigüedad: 7 años, 11 meses
Puntos: 0
Respuesta: Listado y Botones con CSS

Gracias!

Creo que copiaré el código e intentaré modificar lo que necesito.

Era tan feliz trabajando con flash...

un saludo :D
  #6 (permalink)  
Antiguo 28/01/2010, 15:44
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Listado y Botones con CSS

Hola:

Cita:
Iniciado por nueve Ver Mensaje
Era tan feliz trabajando con flash...
Seguro, que cuando empezaste con el flash tuviste más de un problema. ¿o me equivoco?

Pues paciencia.

Saludos.


Etiquetas: botones, listado
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 11:13.