hipervinculos <a href> de ancho fijo.

[Calisco]

Como puedo lograr esto ???

tengo este codigo html

Código PHP:

  <div class="barra"> 
<a href="hola">hola</a> 
<a href="chau">chau</a> 
</div>  
   

Bueno, yo quiero que aparezcan uno al lado del otro pero con un ancho fijo.
Si le pongo por ejemplo width:150px no me da bola. Para que me tome el ancho tengo que ponerle display: block. Pero cuando hago eso, me pone un link abajo del otro, y yo quiero uno al lado del otro.
Alguien sabe como hacerlo ?
Saludos y Gracias.

[praetor2004]

Y si usás una lista? De esa manera podés usar la opcion display:block, pero con un align:left o align:right y se te alinean uno despues de otro, y le das un ancho fijo.

[AlZuwaga]

display: block;
float: left;
width:150px;

y si, es mejor usar una lista para ello.

[Calisco]

y si uso eso mismo en el <a> ?. Lo voy a probar.

[Calisco]

lo que hice ...

Código PHP:

  .barra a
{
display: block;
width: 100px;
align: letf;  
   

Esto funciona, pero se me desalinean todos los demas divs que tengo en mi estructura. Supongo que trabajando un poco mas los divs podria funcionar.
Por otro lado, yo no quiero agregar mas codigo html que el de los <a href=" ....
Saludos.

[praetor2004]

Oops... gracias Al Zuwaga por corregir mi error, no es align:left (que es para texto) sino float:left, y para ello tienes que crear el codigo XHTML de forma bien estructurada, seria bueno que te pasaras por las faqs de XHTML y las de CSS para que entendieras mejor como funciona esta combinacion. (lo último para Calisco).

[Calisco]

Yo lo entiendo bien; y tambien me confundi con align. En realidad en mi codigo puse float; pero no funciona. O funciona como explique arriba.

Mi pregunta es concreta y sencilla.
Necesito que los tags <a> esten en la misma linea y de ancho fijo SIN codigo adicional html. lL codigo html no lo quiero tocar. Si tengo que ponerme a agregar divs o ul-li para lograr este objetivo, lo hare.
Pero ... supongo ... tiene que haber alguna porpiedad que haga que las etiquetas <a> tengan ese comportamiento.

[JavierB]

Hola Calisco

El código que te puso Al Zuwaga debería funcionarte:

Código:

.barra a {
  width:150px;
  display:block;
  float:left;
}

Saludos,

[praetor2004]

Sip, además, no es agregar cosas sin sentido a tu código HTML, es la manera correcta de hacer las cosas, siguiendo estándares y teniendo un orden adecuado cuando estructuras tu página... Intenta lo que dijo AlZuwaga pues deberia funcionar para ti.

[AlZuwaga]

Hola praetor2004, cuando puse en negritas el float: left no fue para marcarte un error o confusión tuya ni nada similar. Si bien hay como 20 minutos de diferencia entre tu respuesta y la mía, cuando abrí este mensaje de Calisco no había ninguna respuesta (será larga la explicación, pero ocurre que generalmente abro demaciados mensajes simultáneamente y, entre que leo y respondo algunos, puede ocurrir que mi respuesta llegue con mucha demora. Finalmente respondí usando la "respuesta rápida" -¡que en realidad fue lenta¡- y vi tu mensaje. Por ello lo edité instantáneamente y puse eso de "y si, es mejor usar una lista...")

Finalizando, coloqué en negritas el float: left por el sinmple hecho que Calisco colocó en negritas el width:150px y el display: block

Ahora para Calisco: Te recomiendo que modifiques tu HTML para eliminar ese div class barra y en lugar de ello coloques un UL id barra. Ok, el HTML crecerá en tamaño (muy poco), pero ganarás en semántica y en flexibilidad a la hora de jugar con él (y mucho!)

[Calisco]

No pienso modificar en HTML. Y bueno, junto con lo que me dijeron y me di un poco de maña en unas alturas (height) de unos divs termino saliendo bien.
Lo tengo que probar en IE, ya que yo uso linux.
El menu del sitio esta en http://www.xifox.com.ar/bono/. Si se meten en Listado van a ver un indice de paginas.
Saludos y Gracias.

[AlZuwaga]

Allá vos