Ergebnis 1 bis 5 von 5

Thema: Navigationsleiste spinnt mit Explorer, Firefox klappt

  1. #1
    noob222
    Gast

    Standard Navigationsleiste spinnt mit Explorer, Firefox klappt

    Hallo, ich habe ein Problem worauf ich nicht komme. Ich habe diese Frage auch in einem anderem Forum gestellt, jedoch konnt mir keiner helfen. Ich hoffe, das einer von euch mir den entscheidenen Tipp geben kann.

    Folgendes. Ich habe in einer Webseite ein Navigationsleiste/Menüleiste eingefügt, welches mit dynamischer Ein- und Ausblenung arbeitet.
    In meinem Beispiel habe ich ein "Test" Button. Wenn ich mit der Maus auf "Test" gehe, dann sollen sich weitere Unterpunkte anzeigen. Aber auch nur wenn ich mit der Maus auf "Test" gehe oder klicke.
    Dafür habe ich eine CSS-Datei geschrieben welches diese dynamische Ein-und Ausblendung ermöglicht. Diese Vorgehen klappt auch ganz gut mit dem Mozilla Firefox. Jedoch kann ich es mit dem InternetExplorer nicht realisieren.
    Ich komme auch nicht daruf, wie ich es machen soll. Hab viel rumporbiert und gegooglet aber nicht schlau geworden.
    Beim InternetExplorer wird "Test" ohne seine Unterpunkte angezeigt, wenn ich mit der Maus auf diesen Button gehen.

    was kann ich da machen? wahrscheinlich ist es nur ein 3 Zeilter für die CSS-Datei.

    Hier habt ihr mal die CSS und HTML Code. Ich wäre euch sehr dankbar für eure hilfe

    Code zu HTML(Menüleiste):
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml">
    <head>
    <title>Unbenanntes Dokument</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <LINK REL=stylesheet HREF="nav_bak.css" TYPE="text/css">
    </head>
    
    <body leftmargin="0" rightmargin="5" topmargin="3">
    
    <div id="Rahmen"><ul id="Navigation">
    [*]Beispiel[*]Beispiel2[*]Beispiel3[*]Beispiel4[*]Beispiel5
    	[*]Test
          <ul>[*]Test1[*]Test2
    	[*]Test3
    	[*]Test4[/list]
        
       </div>
    </body>
    </html>

    und hier ist der Code für die CSS-Datei:
    Code:
    td &#123;font-size&#58; 16px; color&#58;#FFFFFF; font-weight &#58; bold; background-color &#58; #942428;&#125;
    .nav &#123;font-size&#58; 16px; color&#58;#000000; font-weight &#58; bold; background-image &#58; #ffffff;&#125;
    
    a &#123;	font-size&#58; 16px; text-decoration&#58; none; font-weight &#58; bold;&#125;
    a&#58;link &#123;color&#58;#E9E9E9; &#125;
    a&#58;visited &#123;	color&#58;#E9E9E9; &#125;
    a&#58;active &#123;color&#58;#E9E9E9; &#125;
    a&#58;hover&#123;color&#58; #942428; bgcolor&#58;#FFFFFF;&#125;
    
    body &#123;
        font-family&#58; "Trebuchet MS";
    	font-size&#58; 16px;
    	font-weight&#58; bolder;
    	text-decoration&#58; none;
    	margin-left&#58;5;
      &#125;
      ul#Navigation &#123;
        width&#58;auto;
    	color&#58;black;
        height&#58;auto;
        background&#58;transparent;
    	padding&#58;0px;
    	border&#58; none;
      &#125;
      * html ul#Navigation &#123;  /* Korrekturen fuer IE 5.x */
        width&#58; 97px;
        w\idth&#58; 0em;
        padding-left&#58; -3em;
        padd\ing-left&#58; -2em;
    	margin-left&#58;-5em;
    	
      &#125;
      ul#Navigation li &#123;
        list-style&#58; none;
        margin&#58; 0.1em; padding&#58; 0;
      &#125;
    
      ul#Navigation li ul &#123;
        margin&#58; 0 0 0 1em; padding&#58; 0;
      &#125;
      ul#Navigation li ul li &#123;
        margin&#58; 0.2em 0;
      &#125;
      * html ul#Navigation li ul li &#123;  /* Korrektur fuer IE 5.x */
        margin-left&#58; 1px; /* 1 */
        ma\rgin-left&#58; 1em;
    	display&#58;none; top&#58; 0.6em;
    
      &#125;
    
      ul#Navigation a &#123;
        color&#58;E9E9E9;
    	margin&#58;2px 0;
    	text-decoration&#58;none;
    	display&#58;block;
    	border&#58; none;
    	width&#58;97px;
    	background-image&#58; url&#40;images/nav_td-img.jpg&#41;;
    	background-repeat&#58; no-repeat;
    	height&#58; 25px;
    	padding-top&#58; 2px;
    	padding-right&#58; 0px;
    	padding-bottom&#58; 0px;
    	padding-left&#58; 5px;
    &#125;
    
    * html ul#Navigation a &#123;
        width&#58; 97px;    /* Breitenangabe fuer IE 5.x */
        w\idth&#58; 20em;  /* Breitenangabe fuer IE 6 */
    	margin-left&#58;5.7em;
      &#125;
      * html ul#Navigation li ul li a &#123;
        width&#58; 97px;    /* Breitenangabe fuer IE 5.x */
        w\idth&#58; 20em;  /* Breitenangabe fuer IE 6 */
    	margin-left&#58;5.7em;
    	display&#58; block;
    	display&#58;none; top&#58;auto;
      &#125;
    
      
      ul#Navigation a&#58;hover &#123;
        color&#58;#942428;
    	background-image&#58; url&#40;images/nav_td-img_white_and_rand2.jpg&#41;;
    	background-repeat&#58; no-repeat;
    	border&#58; none;
      &#125;
        /* Erweiterung zur dynamischen Ein-/Ausblendung */
      ul#Navigation li>ul &#123;
        display&#58;none; top&#58; 0.6em;
      &#125;
      ul#Navigation li&#58;hover>ul, ul#Navigation li>a#aktuell+ul &#123;
        display&#58; block;
      &#125;
      
      
      /* Workaround fuer den IE 7 */
      *&#58;first-child+html ul#Navigation ul &#123;
        padding-bottom&#58;0.4em;
      &#125;
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  3. #3
    Gast

    Standard

    danke für das beispiel. es klappt in der tat für den internet explorer. aber das beispiel tut es nicht für den firefox!!!!

  4. #4
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    sollte es schon, habs gleiche und da gehts (siehe meine hp)....

    du hast schon gesehen das du 2 teile fürs html und 2 teile fürs css hast,
    beide müssen angepasst werden...
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  5. #5
    Gast

    Standard

    ok, all die probleme sind dank deiner beispiel daten gelöst.
    hab nur noch ein problem mit dem internetexplorer.
    dieses problem ist erst heute aufgetreten.
    und zwar zeigt der internet-explorer bei der dynamsichen einblendung die unterpunkte extrem breit an...
    ich weiss nicht woran es liegt.
    mit dem firefox klappt es nur perfekt.

    für eine hilfe für dieses "kleine" problem wäre ich sehr dankbar. es wirklich nur noch dieses problem, die breite den anderen buttons anzupassen.

    hier die überarbeiteten css Dateien und die html Datei:


    hier die test.css Datei
    Code:
    #menue &#123;
    display&#58;none;
    &#125;
    
    .stupidie &#123;
    display&#58; block;
    position&#58; absolute;
    top&#58; 264px;
    left&#58; -73px;
    width&#58;20px;
    z-index&#58; 200;
    &#125;
    
    a.auss &#123;
    text-decoration&#58;none;
    display&#58; block;
    overflow&#58; hidden;
    width&#58; 101px;
    height&#58; 25px;
    font-weight&#58; bold;
    text-align&#58;auto;
    color&#58; #FFFFFF;
    background&#58;transparent;
    border&#58; 2px;
    /* background-image&#58; url&#40;images/nav_td-img.jpg&#41;;
    background-repeat&#58; no-repeat; */
    
    &#125;
    a&#58;hover.auss &#123;
    overflow&#58; visible;
    background-color&#58; #FFFFFF;
    color&#58; #fff;
    width&#58;10px;
    &#125;
    a&#58;hover.auss table &#123;
    display&#58; block;
    margin-top&#58; 4px;
    background-color&#58; #FFFFFF;
    color&#58; #FFFFFF;
    border-collapse&#58; collapse;
    &#125;
    
    a.inn &#123;
    display&#58; block;
    width&#58; 101px; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
    padding&#58; 2px 0;
    font-size&#58;80%; /* fuer 5er IEs auf 80% reduzieren */
    font-weight&#58; normal;
    text-align&#58; auto;
    text-decoration&#58; none;
    /*background-image&#58; url&#40;images/nav_td-img.jpg&#41;;
    background-repeat&#58; no-repeat; */
    color&#58; E9E9E9;
    &#125;
    a&#58;visited.inn &#123;
    background-color&#58; #ecd8ae;
    color&#58;#FFFFFF;
    text-decoration&#58; none;
    &#125;
    a&#58;hover.inn &#123;
    color&#58;#942428;
    /*background-image&#58; url&#40;images/nav_td-img_white_and_rand2.jpg&#41;;
    background-repeat&#58; no-repeat; */
    border&#58;none;
    width&#58;10px;
    &#125;
    span.menutag &#123;
    display&#58; block;
    cursor&#58; default;
    &#125;

    hier die nav_bak3.css Datei:
    Code:
    td &#123;font-size&#58; 16px; color&#58;#FFFFFF; font-weight &#58; bold; background-color &#58; #942428;&#125;
    .nav &#123;font-size&#58; 16px; color&#58;#000000; font-weight &#58; bold; background-image &#58; #ffffff;&#125;
    
    a &#123;	font-size&#58; 16px; text-decoration&#58; none; font-weight &#58; bold;&#125;
    a&#58;link &#123;color&#58;#E9E9E9; &#125;
    a&#58;visited &#123;	color&#58;#E9E9E9; &#125;
    a&#58;active &#123;color&#58;#E9E9E9; &#125;
    a&#58;hover&#123;color&#58; #942428; bgcolor&#58;#FFFFFF;&#125;
    
    body &#123;
        font-family&#58; "Trebuchet MS";
    	font-size&#58; 16px;
    	font-weight&#58; bolder;
    	text-decoration&#58; none;
    	margin-left&#58;5px;
    	
      &#125;
      ul#Navigation &#123;
        width&#58;auto;
    	color&#58;black;
        height&#58;auto;
        background&#58;transparent;
    	padding&#58;0px;
    	border&#58; none;
    	margin-left&#58;5px;
    	
      &#125;
      * html ul#Navigation &#123;  /* Korrekturen fuer IE 5.x */
        width&#58; 97px;
        w\idth&#58; 0em;
        padding-left&#58; -3em;
        padd\ing-left&#58; -2em;
    	margin-left&#58;-5em;
    	
      &#125;
      ul#Navigation li &#123;
        list-style&#58; none;
        margin&#58; 0.1em; padding&#58; 0;
      &#125;
    
      ul#Navigation li ul &#123;
        margin&#58; 0 0 0 1em; padding&#58; 0;
    	margin-left&#58;0px;
      &#125;
      ul#Navigation li ul li &#123;
        margin&#58; 0.2em 0;
      &#125;
      * html ul#Navigation li ul li &#123;  /* Korrektur fuer IE 5.x */
        margin-left&#58; 1px; /* 1 */
        ma\rgin-left&#58; 1em;
    	display&#58;none; top&#58; 0.6em;
    
      &#125;
    
      ul#Navigation a &#123;
        color&#58;E9E9E9;
    	margin&#58;2px 0;
    	text-decoration&#58;none;
    	display&#58;block;
    	border&#58; none;
    	width&#58;97px;
    	background-image&#58; url&#40;images/nav_td-img.jpg&#41;;
    	background-repeat&#58; no-repeat;
    	height&#58; 25px;
    	padding-top&#58; 2px;
    	padding-right&#58; 0px;
    	padding-bottom&#58; 0px;
    	padding-left&#58; 5px;
    &#125;
    
    * html ul#Navigation a &#123;
        width&#58; 97px;    /* Breitenangabe fuer IE 5.x */
        w\idth&#58; 20em;  /* Breitenangabe fuer IE 6 */
    	margin-left&#58;5.7em;
      &#125;
      * html ul#Navigation li ul li a &#123;
        width&#58; 97px;    /* Breitenangabe fuer IE 5.x */
        w\idth&#58; 20em;  /* Breitenangabe fuer IE 6 */
    	margin-left&#58;9.7em;
    	display&#58; block;
    	display&#58;none; top&#58;auto;
      &#125;
    
      
      ul#Navigation a&#58;hover &#123;
        color&#58;#942428;
    	background-image&#58; url&#40;images/nav_td-img_white_and_rand2.jpg&#41;;
    	background-repeat&#58; no-repeat;
    	border&#58; none;
      &#125;
        /* Erweiterung zur dynamischen Ein-/Ausblendung */
      ul#Navigation li>ul &#123;
        display&#58;none; top&#58; 0.6em;
    	margin-left&#58;10px;
      &#125;
      ul#Navigation li&#58;hover>ul, ul#Navigation li>a#aktuell+ul &#123;
        display&#58; block;
      &#125;
      
      
      /* Workaround fuer den IE 7 */
      *&#58;first-child+html ul#Navigation ul &#123;
        padding-bottom&#58;0.4em;
      &#125;

    und hier die html-Datei:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml">
    <head>
    <title>Unbenanntes Dokument</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    
    </head>
    
    <body leftmargin="0" rightmargin="5" topmargin="3">
    
    <div id="Rahmen"><ul id="Navigation">
    <LINK REL=stylesheet HREF="nav_bak3.css" TYPE="text/css">
     	[*]Home[*]News[*]test-Info[*]Arbeitskreis
    	[*]Mitarbeiter
    	[*]Bilder
    	[*]Schulung
    	[*]ProE
    	[*]Zugang
       
    <div id="Rahmen"><ul id="Navigation">
    <LINK REL=stylesheet HREF="nav_bak3.css" TYPE="text/css">
    	[*]Download
          <ul>[*]Archiv[*]Artikel
    		[*]Lizenz
    		[*]Support[/list]
        
    		</div>
    	
    
    <!-- Der folgende Block bedient nur IEs! 
    	 Durch diese Redundanz vermeiden wir den Einsatz von Javascript. -->
    
    <!--&#91;if IE&#93;>
    	<div class="stupidie">
    	<LINK REL=stylesheet HREF="test.css" TYPE="text/css">
    <a class="auss" href="#"><span class="menutag">Download</span>
    <table><tr><td>
    Archiv
    Artikel
    Lizenz
    Support
    </td></tr></table>
    </a>
    	</div>
    <!&#91;endif&#93;-->
    </div>
    
    </body>
    </html>

    vilen dank schon mal im voraus
    ps: es geht eigentlich nur um die test.css Datei, weil das die nav_bak3.css Datei für den Firefox ist und bei Firefox klappt es.

    mfg[/code]

Ähnliche Themen

  1. Internet Explorer und Firefox Explorer tauglich
    Von forummx im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 21.11.2009, 22:13
  2. iNET KLAPPT NUR BEIM EXPLORER
    Von w357 im Forum Computer - Internet Forum
    Antworten: 7
    Letzter Beitrag: 05.07.2008, 00:30
  3. Navigationsleiste wird in Firefox nicht angezeigt
    Von Baldwin im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 10.12.2007, 17:21
  4. probleme mit inet explorer / in firefox klappt es
    Von igeligel im Forum HTML & CSS Forum
    Antworten: 22
    Letzter Beitrag: 10.08.2006, 20:16
  5. firefox spinnt
    Von viper3000 im Forum Computer - Internet Forum
    Antworten: 16
    Letzter Beitrag: 14.07.2005, 09:20

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •