Spry Menü im Internet Explorer Oben

[mru]

Hallöchen,
habe mich heute erst registriert, weil ich durch die Suche leider kein passendes Ergebnis gefunden habe!
Es geht darum, mein Menü öffnet sich im Firefox und Opera ganz normal direkt dadrunter aber im Internet Explorer erscheinen die Fenster oben an der Leiste und das auch noch versetzt, hier mal der CSS Code:

/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
{
z-index: 1000;
}
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 9.5em;
float: left;
background-color: #B70001;
}
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 9.5em;
position: absolute;
left: -1000em;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
{
left: auto;
}
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
{
width: 9.5em;
}
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
{
position: absolute;
margin: -0% 0 0 100%;
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
left: auto;
top: 0;
}

/*******************************************************************************

DESIGN INFORMATION: describes color scheme, borders, fonts

*******************************************************************************/

/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
{
border: 1px solid #CCC;
}
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
{
display: block;
cursor: pointer;
background-color: #B70001;
padding: 0.5em 0.75em;
color: #FFFFFF;
text-decoration: none;
}
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
background-color: #010002;
color: #FFF;
}
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
background-color: #010002;
color: #FFF;
}

/*******************************************************************************

SUBMENU INDICATION: styles if there is a submenu under a given menu item

*******************************************************************************/

/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
{
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
{
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}

/*******************************************************************************

BROWSER HACKS: the hacks below should not be changed unless you are an expert

*******************************************************************************/

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
{
position: absolute;
z-index: 1010;
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
ul.MenuBarHorizontal li.MenuBarItemIE
{
display: inline;
f\loat: left;
background: #FFF;
}
}



Ich habe irgendwas gelesen, das vielleicht die Höhe nicht stimmt oder so, aber hab angst was kaputt zu machen, weil die seite im Prinzip schon fertig ist!

Vielen Dank schonmal für die Hilfe und bitte nicht zu viel Fachchinesisch DANKE

[MichaelM]

Du kannst nichts kaputt machen.
Sichere doch die Originalseite bzw. CSS-Datei unter einen anderen Namen.
Dann kannst Du ohne Ende experimentieren.
Wäre natürlich schön wenn Du Dich schon vorher etwas mit CSS beschäftigt hast.

[mru]

Noch schöner wäre es wenn man hilfreiche antworten bekommt!
Hat denn keiner eine Idee woran das liegt?

[Rinaldo]

Kannst Du noch einen Link zur Site schreiben?

[Torsten]

Noch schöner wäre es wenn man hilfreiche antworten bekommt!
Hat denn keiner eine Idee woran das liegt?

Na Super - spring mal nicht gleich aus dem Anzug

Mit einem Onlinebeispiel könnte der eine oder andere vermutlich besser nachvollziehen was im IE anders aussieht als im FF oder Opera!

Du hast hier reinen CSS-Code gepostet das gehörte eigentlich ins CSS-Board, bezeihst Dich aber auf ein Spry Problem - was teilweise mit Dreamweaver zu tun hat.
Spry ist ein eigenständiges Framework also lassen wir das mal so stehen, aber gib uns bitte einen Link

[mru]

Sollte jetzt nicht böse klingen, aber mit soner Antwort konnte ich leider nix anfangen
Ok, hier der Link zu meiner Seite!

www.mrunbelievable.de

Danke für die Hilfe

[Torsten]

Auf Anhieb fällt mir da nichts ein woran es liegen könnte.
Im Sourcecode sieht man das Du noch andere JavaScripte eingebunden hast, vielleicht kollidieren diese.

Du könntest folgendes einmal probieren:

• erstell ein neues leeres Dokument
• lege hier zum Test einmal einen Spry-Bereich mit Deiner Navigation an
• teste mal in allen Browsern ob der Fehler auch auftritt

Falls hier alles korrekt funktioniert, probier einmal in Deiner fertigen Site die zusätzlichen Dinge wegzulassen (zusätzliche JavaScripte) Player etc. und probier ob es daran liegt.

[mru]

So, ich habe in der SpryMenuBarHorizontal.css
den wert geändert:

/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
left: auto;
top: 100%; (vorher stand hier 0)
}

Aber da hat sich leider nichts getan!
Ist genauso wie vorher?

Oder hab ich die falsche Datei genommen?

[mru]

Also ich habs immernoch nicht hinbekommen! Wäre immernoch sehr dankbar für Hilfe!
Würde sogar dafür zahlen! Weil ich echt keine Ahnung davon habe!