bei menü hover neuer Bereich öffnen

[joomsch]

Hallo ,

ich möchte bei meinem Menü eine Art Submenü einbauen.
Jedoch konnte ich es mit einem normalen Submenü nicht realisieren.

Es soll ca so aussehen:
Es soll ein Bereich geöffnet werden in welchem im grauen Bereich noch text steht + ein Button mit Hover. ( Mehr Informationen Bereich )
Ich weiß jedoch nicht wie ich das in mein Menü einbauen soll.
Würde mich über Hilfe freuen :)

#menue {
    margin-top: 10px;
    width: 960px;
    
}


  #menue ul {
    height: 30px;
    text-align: center;
}


  




#menue li {
    display: inline;
    padding: 10px;
    list-style: none;
}






#menue li a {
    font-size: 18px;
    font-family: Myriad Pro;
    text-decoration: none;
    color: black;
}


#menue li a:hover {
    font-size: 18px;
    font-family: Myriad Pro;
    text-decoration: none ;
    border-bottom: 3px solid #d5e9f4;
}

 <div id="menue">                <ul>                    <li><a href="#">Webdesign</a></li>                                        <li><a href="#">Entwicklung</a></li>                    <li><a href="#">Hosting</a></li>                    <li><a href="#">Schulung</a></li>                    <li><a href="#">Portfolio</a></li>                    <li><a href="#">Kontakt</a></li>                </ul>                               </div>

Danke schonmal :)

 

[threadi]

Du müsstest innerhalb eines Menüpunkt-Links ein span einfügen mit dem gewünschten zusätzlichen Text:

<li>
 <a href="#">
  Webdesign
  <span>Mehr Informationen</span>
 </a>
</li>

Dieses span wird normalerweise nicht angezeigt.

#menue li a span { display: none; }

und bei hover vom Link eingeblendet:

#menue li a:hover span { display: block; }

Gestaltung davon ist dann dir überlassen.