Popup-Menü

ts230

Gesperrt
Hallo!
Ich hoffe ich bin hier richtig.;)
Ich möchte ein kleines PopUp menü machen.
Die einträge(wenn ausgewählt) sollen blau.
Ich habe es schon mit ul&li "gestyled" mit CSS probiert wobei nicht das rausgekommen ist was ich wollte. Falls mein CSS-Code nützlich is:
CSS:
#PopUpMenu{border:1px solid black;
background-color:#fff;
z-index:750;
margin:0px 0px 0px 0px;
}
#PopUpMenu li:hover{background-color:blue;
color:#000;
list-style:none;
cursor:pointer;
margin:0px 0px 0px 0px;}
#PopUpMenu li{background-color:#fff;
color:#000;
list-style:none;
}
Und HTML:
HTML:
<span id="PopUpMenu" style="display:none;">
<ul>
<li>Test1</li>
<li>Test2</li>
</ul>
</span>
Es kommt ein Menü mit über die Ganze breite und mit komischen Rändern trotz margin-angabe.
Mal im Anhang ein Bild wie ich es (gerne)möchte.
Ich hoffe,ihr könnt mir helfen.
 

Anhänge

  • Screenshot-7.jpg
    Screenshot-7.jpg
    27,9 KB · Aufrufe: 71
Moin,

Blockelemente, wie das ul-Element, dürfen in keinem Inline-Element (span) eingebettet sein - siehe hierzu die HTML-Referenz für Inline-Elemente - ersetze es also durch ein div-Element.

Desweiteren besitzen Blockelemente die Eigenschaft, sich der Breite ihres Elternelements anzupassen - daher auch die Breite über die komplette Seite. Ergo wirst du den Anzeigebereich des Menüs durch eine Breitenangabe "begrenzen" müssen.

Wenn da noch irgendwo ein Rand bzw. Abstand im Textfluß existiert, liegt es einfach daran, dass du den voreingestellten Außen- und Innenabstand des ul-Elements nicht auf null zurückgesetzt hast:

CSS:
#PopUpMenu ul {
margin:0;
padding:0;
}


mfg Maik
 
Danke!
damit das Menü über allem Anderen erscheint habe ich den z-index mal einfach auf 750 gesetzt.Der Rest der Seite hat z-index:1-aber das Menü geht immer noch nicht dadrüber.Im anhang mal ein Screenshoot.
 

Anhänge

  • Screenshot-8.jpg
    Screenshot-8.jpg
    27,7 KB · Aufrufe: 50
Hi,

z-index greift auch nur in Verbindung mit einer Angabe zur Positionsart position (absolute oder relative).

mfg Maik
 
Zurück