Kleine CSS probleem

Beste lezer,

Ik ben me layout aan het slice maar stuit op een probleem, ik weet niet hoe ik de menu moet maken. Ik weet wel iets met de

en de
• maar ik weet gewoon niet hoe ik het moet realiseren. Kan iemand mij helpen?
  
  Het gaat om:
  Spoiler tonen

  
  Het streepje die je ziet is een plaatje.
  
  Momenteel heb ik het volgende:
  
  

  #menu {
      background: url(../images/outgame/menu_bg.png);
      width: 996px;
      height: 61px;
      margin: 26px auto 0 auto;
  }
  
  #menu_content {
      text-align: center;
      font-size: 16px;
      font: Arial;
      color: #b7cfe3;
      text-shadow: -1px 0 #124b7c, 0 1px #124b7c, 1px 0 #124b7c, 0 -1px #124b7c;
  }
  
  #menu_content li {
      list-style: none;
  }

  
  
  Wie kan me helpen?
  Alvast bedankt!
  
  MVG.

Geef je #menu_content li een float:left mee...

Aarclay schreef:

Geef je #menu_content li een float:left mee...

Er zal nog meer moeten gebeuren, ik heb namelijk dit nu (nog zonder de float)

Ja, maar dit gaat puur om hem horizontaal te krijgen. De rest van de markup en layout mag je zelf uitvlooien ..

Doe:

• menu ding
• menu ding 2
(etc)

En de ul geef je als style:

#menu_content ul {
display:inline;
}

Freestyle schreef:

Doe:

• menu ding
• menu ding 2
(etc)

En de ul geef je als style:

#menu_content ul {
display:inline;
}

Bedankt, hij is nu bijna af, ik heb nu dit:

Spoiler tonen

Zoals je ziet staat de tekst niet mooi in het midden, hoe kan ik dit oplossen?

Mijn CSS is nu:

#menu_content {
    text-align: center;
    font-size: 16px;
    font: Arial;
    color: #b7cfe3;
    text-shadow: -1px 0 #124b7c, 0 1px #124b7c, 1px 0 #124b7c, 0 -1px #124b7c;
    padding-left: 400px;
}

#menu_content li {
    list-style: url(../images/outgame/menu_line.jpg);
    float: left;
    padding-top: 7px;
    padding-right: 20px;
}

#menu_content ul {
    display:inline;
    float: center;
}

float: center?

Je kan left, right, none of inherit doen, maar uiteraard geen center.

Waarom "#menu_content?"

Demondicing schreef:

Zoals je ziet staat de tekst niet mooi in het midden, hoe kan ik dit oplossen?

heel simpel met text-align:center;