Como hacer una raya discontinua

[Oier]

Hola,

Quiero hacer una raya discontinua(---) en mi web... Parece muy facil, darle una y otra vez a la tecla - y listo, pero es muy difícil que tenga la anchura que yo quiera, y ademas en explorer y en nestcape se ve de distinta anchura. Quiero hacerlo como esta en www.sindominio.net ¿Como puedo hacerlo?

[La2daElegida]

Es facil, tenes q crear un dibujo, de una rallita con un espacio.
y una tabla...

<table width="100%">
<tr>
<td background="rallita.gif">&nbsp;</td>
</tr>
</table>

Asi se repite tu dibujo.. por toda la tabla.. no olvides poner q sea 100%.

[JavierB]

Hola, Oier.

Otra opción, sin dubujillo:

<div style="width:200px;border-bottom:1px dashed black"></div>

Saludos,

[TOTE]

Esta es otra solucion, muchas rayas. Una en cada celdilla de una tabla:


<table width="400" border="0">
<tr>
<td><hr width="30"></td>
<td><hr width="30"></td>
<td><hr width="30"></td>
<td><hr width="30"></td>
<td><hr width="30"></td>
<td><hr width="30"></td>
<td><hr width="30"></td>
</tr>
</table>

Suerte, un saludo.

[La2daElegida]

Pero el no quiere un tamaño fijo.. si la tabla crece.. crece la linea.. sino q ponga un gráfico y ya.

[Oier]

Hola,

Gracias a todos por responderme. La solución que más me ha gustado ha sido el de JavierB. He probado y me funciona, pero ¿como puedo cambiarlo de color?

[TOTE]

Tanto en la solucion de JavierB como en la mía se pueden hacer tamaños relativos:

<div style="width:100%;border....

<table width="100%" border="0"><tr>
<td><hr width="100%"></td>...

(Por si a alguien le interesa)

[TOTE]

<div style="width:100%;border-bottom:1px solid dashed; border-color:#FF0000" ></div>

[La2daElegida]

Me quitaste la palabra de la boca.. o nose.. como se dice.. en este caso.... Tote. =)

[Oier]

Gracias Tote. Ah, y...¿para hacerlo en vertical?
He probado con height:100%;border-bottom:1px, pero no funciona.

[CORE]

<hr style="border:1px dotted #f00;padding:10px auto;" />

Asi se ve mejor

saludos

[Oier]

¿Nadie sabe como hacer la raya que propone JavierB en vertical?

[JavierB]

Hola de nuevo.

<div style="height:100%;border-left:1px dashed black"></div>

También puedes probar con border-right

Supongo que ya lo sabes, pero por si acaso te lo digo, para colocarla en el lugar de la página que quieras añade esto al style

position:absolute; left:200px

Saludos,

[KarlanKas]

Creo que este post se ha ganado descansar en el foro de CSS

[Oier]

¡GRACIAS A TODOS!

[GG]

OJO que en el Explorer 5.0 las rayas discontinuas (dashed o dotted) se reconocen sólo si son más grandes que 2px. Si son de 1 px las muestra como líneas continuas.