Antworten auf deine Fragen:
Neues Thema erstellen

Dropdown - CSS Problem

A

AukeArts

Guest

Guten Tag zusammen,
in Mediengestaltung ist es unsere Aufgabe, eine Homepage für eine Apotheke zu gestalten. Momentan hänge ich jedoch an dem Dropdown Menü feste. Ich möchte ein Tab Dropdown Menü machen, aber da gibt es ein Problem. Seht selbst.



Ich habe im moment keine Ahnung was ich falsch gemacht habe..kommt auch vllt. daher dass ich CSS noch nicht komplett verstanden habe :D

Also, was muss ich ändern um mein Ziel zu erreichen ? Wenn es geht, bitte nur "tipps" damit ich selber tüfteln kann :D

HTML:
@import url("mainPage.css");
#navbar {
    width:660px;
    margin-left:20px;
    padding-top:55px;
    }

#navbar #holder {
    height:45px;
    width:630px;
    border-bottom:1px solid #CCC;
    padding-left:20px;
    }


#navbar #holder ul {
    list-style:none;
    margin:0;
    padding:0;
}

#navbar #holder ul li a {
    text-decoration:none;
    float:left;
    margin:5px;
    font-family:verdana,geneva,arial,helvetica,sans-serif;
    font-weight:bold;
    font-size:14px;
    color:#000;
    border:1px solid #999;
    border-bottom:none;
    padding:10px;
    width:80px;
    text-align:center;
    display:block;
    background:url(../Template/navbar/menu_bg.gif);
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;
    }

#navbar #holder ul li a:hover{
    background:url(../Template/navbar/menu_bg_hover.gif);
    text-color:#333;
    }
    
#holder ul li a#onlink {
    background:#FFF;
    color:#000;
    border-bottom: 1px solid #FFF
}

#holder ul li a#onlink:hover {
    background:#FFF;
    text-color:#000;
}

li ul {
    display: none;
    position: absolute; 
    top: 1em;
    left: 0;
  }
  
li:hover ul {
    display: block; 
    }

HTML:
<div id="navbar">
    <div id="holder">
  <ul>
        
        
        
        
        <li><a href="#" >Home</a></li>
        
        
        
        <li><a href="#">Apotheke</a></li>
        
        
        
        <li><a href="#">Service</a>
        <ul>
        <li><a href="#">Service</a></li>
        <li><a href="#">Service</a></li>
        <li><a href="#">Service</a></li>
        </ul>
        </li>
        
        
        
        <li><a href="#" id="onlink">Kontakt</a>  
        
        </ul> <!-- end main ul -->
    </div> <!-- end holder -->
  </div> <!-- end navbar -->

Mit freundlichen Grüßen,
AukeArts
 

cebito

undefined

AW: Dropdown - CSS Problem

Erstmal musst die li positionieren, damit sich die untergeordnete ul an denen ausrichtet... (position:relative; )
 
A

AukeArts

Guest

AW: Dropdown - CSS Problem

Dankeschön :)
Es hat soweit geklappt. Jetzt muss ich es nur noch etwas optimieren.



Mit freundlichen Grüßen,
AukeArts

MfG
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.616
Beiträge
1.538.353
Mitglieder
67.531
Neuestes Mitglied
webahoi
Oben