JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder ein
alternativer Browser verwenden.
Status
Nicht offen für weitere Antworten.
hallo
ich hab folgendes problem:
wenn ihr auf die seite
http://www.stern.de
geht, dann ist dort ein dropdown-menu.
ich habe ein ähnliches gemacht, jedoch
funktioniert es nur bei fullscreen richtig, sonst
verschiebt es sich.
habe mit css eine positionierung angegeben.
wie machen die das bei stern.de das wenn man das browserfenster
nicht im vollbild hat, die menüs trotzdem nicht verschoben sind ???
die bleiben exakt unter den buttons.
bitte helft, wenn ihr tuts für dropdownmenüs habt, immer her damit
dannge
dropdown
das ist der css-code:
DIV.menu1 {
Z-INDEX: 1; LEFT: 140px; VISIBILITY: hidden; POSITION: absolute; TOP: 85px; clip: rect( )
}
A.menu1 {
MARGIN-TOP: 0px; DISPLAY: block; MARGIN-BOTTOM: 0px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu1:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #999999; TEXT-DECORATION: none
}
A.menu1:active {
COLOR: #ffffff; BACKGROUND-COLOR: #999999; TEXT-DECORATION: none
}
DIV.menu2 {
Z-INDEX: 1; LEFT: 250px; VISIBILITY: hidden; POSITION: absolute; TOP: 85px; clip: rect( )
}
A.menu2 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu2:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #738494; TEXT-DECORATION: none
}
A.menu2:active {
COLOR: #ffffff; BACKGROUND-COLOR: #738494; TEXT-DECORATION: none
}
DIV.menu3 {
Z-INDEX: 1; LEFT: 160px; VISIBILITY: hidden; POSITION: absolute; TOP: 85px; clip: rect( )
}
A.menu3 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu3:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #003366; TEXT-DECORATION: none
}
A.menu3:active {
COLOR: #ffffff; BACKGROUND-COLOR: #003366; TEXT-DECORATION: none
}
DIV.menu4 {
Z-INDEX: 1; LEFT: 186px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu4 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 11ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu4:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #ff9900; TEXT-DECORATION: none
}
A.menu4:active {
COLOR: #ffffff; BACKGROUND-COLOR: #ff9900; TEXT-DECORATION: none
}
DIV.menu5 {
Z-INDEX: 1; LEFT: 272px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu5 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu5:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #8a1a1a; TEXT-DECORATION: none
}
A.menu5:active {
COLOR: #ffffff; BACKGROUND-COLOR: #8a1a1a; TEXT-DECORATION: none
}
DIV.menu6 {
Z-INDEX: 1; LEFT: 327px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu6 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 11ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu6:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #003333; TEXT-DECORATION: none
}
A.menu6:active {
COLOR: #ffffff; BACKGROUND-COLOR: #003333; TEXT-DECORATION: none
}
DIV.menu7 {
Z-INDEX: 1; LEFT: 427px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu7 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu7:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #336666; TEXT-DECORATION: none
}
A.menu7:active {
COLOR: #ffffff; BACKGROUND-COLOR: #336666; TEXT-DECORATION: none
}
DIV.menu8 {
Z-INDEX: 1; LEFT: 531px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu8 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu8:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #209394; TEXT-DECORATION: none
}
A.menu8:active {
COLOR: #ffffff; BACKGROUND-COLOR: #209394; TEXT-DECORATION: none
}
DIV.menu9 {
Z-INDEX: 1; LEFT: 619px; VISIBILITY: hidden; POSITION: absolute; TOP: 183px
}
A.menu9 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 11ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu9:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #a33777; TEXT-DECORATION: none
}
A.menu9:active {
COLOR: #ffffff; BACKGROUND-COLOR: #a33777; TEXT-DECORATION: none
}
A.menu10 {
MARGIN-TOP: 2px; DISPLAY: block; MARGIN-BOTTOM: 2px; WIDTH: 10ex; COLOR: #000000; TEXT-DECORATION: none
}
A.menu10:hover {
COLOR: #ffffff; BACKGROUND-COLOR: #999966; TEXT-DECORATION: none
}
A.menu10:active {
COLOR: #ffffff; BACKGROUND-COLOR: #999966; TEXT-DECORATION: none
}
Status
Nicht offen für weitere Antworten.