webForumDet fria alternativet
Logga in / Bli medlem

CSS + <ul> och <li> = :(

HTML & CSS

3 svar · 391 visningar · startad av Troll

Medlem sedan dec. 2003229 inlägg
Trådstart#1

Hejsan!

Skulle behöva hjälp med att formatera en meny av <ul> och <li> för jag får verkligen inte till det :(.

På sidan finns en div där menyn ska ligga:

  <div id="menycont">
      <ul id="meny">
      
      <li>Meny
      <ul>
      <li>- Förstasidan</li>
      <li>- Nyheter</li>
      </ul>
      </li>

      <li>Annat
      <ul>
      <li>- Något</li>
      <li>- Något</li>
      </ul>
      </li>

      <li>Annat 2
      <ul>
      <li>- Något</li>
      <li>- Något</li>
      </ul>
      </li>

      </ul>
  </div>

Första tanken var att göra något i stil med:

#meny ul {
width:100%;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
text-align:center;
background-color: #ccc;
font-weight: bold;
}
#meny li {
width:100%;
text-align:left;
background-color: #fff;
}

Men det blir ju inte riktigt rätt va...

Jag antar att jag måste sätta någon slags formatering för <ul> och <li> men jag får inte till det ordentligt. Hade det vart så att jag hade haft en div för själva rubriken och en för undermenyn hade jag ju gjort något i stil med detta:

.menyrubrik {
width:100%;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
text-align:center;
background-color: #ccc;
font-weight: bold;
}
.menyundermeny {
width:100%;
text-align:left;
background-color: #fff;
}

Hur ska jag göra för att få till det?

Om jag har vart dålig på att förklara så är det alltså såhär jag vill att det ska se ut ungefär:

----------------
Meny
----------------
- Startsida
- Nyheter
----------------
Annat
----------------
- Något
- Något
----------------
Annat 2
----------------
- Något
- Något

Eller ska jag göra på något helt annat sätt istället?

Medlem sedan nov. 20051 596 inlägg
#2

Med en gång när jag såg hur du ville det skulle se ut så tänkte jag på Zengarden t.ex denna sida http://www.csszengarden.com/?cssfile=/191/191.css&page=0 och titta på där det står Select a design...
där man har h3 i stället för det som du har för meny annat och annat2. Det är ju inte fel att göra så eftersom de ju är en slags rubriker och möjligheterna blir så mycket större att få till det då.
Du kan väl kika på sidan och flera och se om du får några idéer, alla sidorna på zengarden har h3 där ... :)

Medlem sedan juni 20014 290 inlägg
#3

Något så här: http://www.gunnard.se/test/troll.html

Medlem sedan dec. 2003229 inlägg
#4

Hej igen!

Tack så himla mycket för tipsen! Det slutade med att jag använde tipset från tanten, att jag inte tänkte på det själv förstår jag inte, väldigt smidigt det där :)

Tack igen.

250 ms totalt · 4 externa anrop · v20260731065814-full.51f67c91
115 ms — deklarationer (db)
0 ms — hämta statistik (cache)
130 ms — hämta tråd, inlägg och bilagor (db)
117 ms — ändringar (db)