Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 14.12.2009, 10:05
flohpapa flohpapa ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2008
Beiträge: 20
flohpapa befindet sich auf einem aufstrebenden Ast
Standard Darstellungsproblem

Hallo Leute,

ich hab ein großes Problem,
ich soll ne Seite erstellen, möglichst barrierearm.

Soweit sogut, jedoch stellt sich die Seite im IE anderst dar als im Firefox.

Wo liegt mein Fehler?

Menüdemo

Code:
/* menu */
* {
	margin: 0;
	padding: 0;
	}

#menue {font-size: 12px; font-weight: bold; width: 1062px; height: 90px; margin: 0;  background: url(../image/menue_hintergrund.png) repeat-x;z-index:90000;}
#menue ul { margin-left: 330px; position:absolute; width: 100%; bottom:0; z-index:999;}
#menue ul li {height: 48px; list-style: none; margin: 0; float: left; display: block;}

#menue ul li a {text-decoration: none; display: block; height: 48px; line-height: 60px; font-size: 1.2em; padding: 0 0 0 10px; color: #0A1F49; background: url(../image/menue_links_normal.gif) no-repeat bottom left;}
#menue ul li a span {text-align: center; float: left; padding-right: 10px; height: 48px; background: url(../image/menue_rechts_normal.gif) no-repeat bottom right;}
#menue ul li a:hover, #menue ul li:hover a { text-indent: 0; line-height: 44px; cursor: pointer; background: url(../image/menue_links_an.gif) no-repeat bottom left;}
#menue ul li a:hover span, #menue ul li:hover a span { text-indent: 0; font-style: normal; background: url(../image/menue_rechts_an.gif) no-repeat bottom right;}
/*#menue ul li a.current, #menue ul li a.section, #menue ul li a.section:hover, #menue ul li a.current:hover { text-transform: uppercase; line-height: 44px; cursor: pointer; background: url(../image/menue_links_aktuelle_rubrik.gif) no-repeat bottom left;} 
#menue ul li a.current span, #menue ul li a.section span, #menue ul li a.section:hover span, #menue ul li a.current:hover span { text-indent: 0; font-style: normal; background: url(../image/menue_rechts_aktuelle_rubrik.gif) no-repeat bottom right;}*/
#menue ul li#menueClosing {background: url(../image/menue_links_normal.gif) no-repeat bottom left; width: 30px;}/*

/* sub-menu (level 1) */

#menue ul li ul, #menue ul li:active ul {text-indent:0; margin-left: 0px; width: auto; float: none; position: absolute; left: -49999px; top:48px;}
#menue ul li:hover ul {left: auto; text-indent:0;}
#menue ul li li {font-size: 0.9em; list-style: none; float: none; height: auto; position: relative;}
#menue ul li li a {
	width: 100px; 
	font-size: 12px; 
	font-weight: normal; 
	color: #0e295c; 
	height: auto; 
	line-height: 18px; 
/*	background: #0A1F49;  */
	padding: 5px 10px 5px 10px; 
	outline-width: 0; 
	filter:Alpha(opacity=100, finishopacity=0, style=0); !important
	-moz-opacity: 0.75;  !important
	opacity: 0.75;  !important 
	overflow: hidden; 
	border-bottom: 1px solid #b3c9d4;
	}
#menue ul li:hover li a {line-height: 18px; background: #e7eff5;}
#menue ul li li a:hover {
	width: 100px; 
	height: auto; 
	line-height: 18px; 
	background: #465672; 
	color: #0e295c; 
	padding: 5px 10px 5px 10px; 
	filter:Alpha(opacity=100, finishopacity=0, style=0); !important
	-moz-opacity: 0.75; !important
	opacity: 0.75; !important 
	overflow: hidden; 
	}
#menue ul li li a span {
	/*background: transparent; */
	float: none;}
#menue ul li:hover li a span {
	background: transparent;
	float: none;
	}
#menue ul li li a.current, #menue ul li li a.section { 
	background: #8c9daf; 
	color: #ffffff; 
	text-transform: uppercase; 
	line-height: 18px; 
	filter:Alpha(opacity=100, finishopacity=0, style=0); !important
	-moz-opacity: 0.75; !important
	opacity: 0.75; !important 
	}
#menue ul li li a.section:hover, #menue ul li li a.current:hover { 
	background: #a3bcd0; 
	color: #0e295c; 
	text-transform: uppercase; 
	line-height: 18px; 
	filter:Alpha(opacity=100, finishopacity=0, style=0); !important
	-moz-opacity: 0.75; !important
	opacity: 0.75; !important 
	}
#menue ul li li:hover a {background-color: #c3d5e2; color: #0e295c;}
#menue ul li li:hover a:hover {background-color: #465672; color: white;}
#menue ul li li:hover a.current, #menue ul li li:hover a.section {background: #8c9daf; color: #ffffff;}
#menue ul li li a.current span, #menue ul li li a.section span, #menue ul li li a.section:hover span, #menue ul li li a.current:hover span {
	font-style: normal; 
	/* background: transparent; */
	}
#menue ul li li a span em {font-style: normal;}

/*.menueansicht {
	filter:Alpha(opacity=0, finishopacity=0, style=0); !important
	-moz-opacity: 0.0; !important
	opacity: 0.0; !important
} */

Code:
<div style="position: absolute; top: 109px; left: 101px; filter:Alpha(opacity=100, finishopacity=0, style=0);  -moz-opacity: 0.75; opacity: 0.75;" id="menue">
    <ul>		
        <li><a href="#" class="menueansicht"><span>Veranstaltung</span></a>
            <ul>
               <li><a href="#" class="menueansicht" title="Das Programm"><span><em>Programm</em></span></a></li>
               <li><a href="#" title="Der Schiffsfahrplan"><span><em>Fahrplan</em></span></a></li>
            </ul>
        </li>
            
        <li><a href="#"><span>Besucherservice</span></a>
            <ul>
                <li><a href="#" title="Eintrittspreise"><span><em>Eintrittspreise</em></span></a></li>
                <li><a href="#" title="Pauschalangebote"><span><em>Pauschalen</em></span></a></li>
            </ul>
        </li>
            <!-- leerer Reiter zum Menüabschluß -->
        <li id="MenuClosing"></li>
            <!-- ############################## -->
      </ul>
</div>
Menüdemo

Geändert von flohpapa (14.12.2009 um 11:59 Uhr)
Mit Zitat antworten
Sponsored Links