Bordes en div y menu

Hola a todos,

estoy liado con mi web y me gustaria hacer una pregunta.

Siguiendo el tutorial paso a paso, he visto que en el apartado del pie de página se le ha dado un borde en cada lado para separar los diferentes apartados (pieuno, piedos, pietres). Esto es sencillo porque son divs diferentes.

Ahora bien, cuando tenemos un menu horizontal y se quiere separar las opciones con un borde la linea solo coje el tamaño de la letra, no el del div. Eso quiere decir que hay que hacer un div para cada apartado del menú o hay otra forma?

Por si no queda claro, me refiero a esto:

<div id="menu">
<ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3
  • Enlace 4

    </div>

    Y que aparezca asi:

    Enlace 1 | Enlace 2 | Enlace 3 | Enlace 4 |

    Muchas gracias!!
  • Hola

    yo eso lo puse precisamente asi:

    <a href="#>Enlace 1 |</a>

    inclui esa barra en el texto jeje

    saludos
    Muchas gracias Yaneth,

    me he estado mirando otras webs y he visto que el menu horizontal lo colocan sobre una imagen jpg (que forma el encuadre del mismo) y las lineas las tienen dibujadas en la imagen. Voy a probar de esta manera a ver que tal.

    Un saludo.
    bueno ya tengo una imagen que hace de barra contenedora, separada en los puntos que toca.

    El problema e ajustar cada elemento a una de las partes. Tengo una longitud de 900px que dividido entre 6 son 150px por elemento de la lista.

    Es mejor que para ajustar cada uno de los elementos del índice los convierta en divs diferentes, de la manera:

    <div id="menuhoriz">
    <div id="opcion1"></div>
    <div id="opcion2"></div>
    <div id="opcion3"></div>
    ...
    </div>

    y ya luego en la hoja de estilos le pongo el alto, el ancho...??
    ya se ha solucionado. He utilizado un div para cada elemento del menu, lo he centrado, dado sus característica y "voila"! Listo!
    Genial!!!

    me alegra, que lo solucionaras a tu manera

    es asi, como se aprende mas

    saludos