Darstellungsproblem IE 6 gegenüber Firefox

Einklappen
X
Einklappen
 
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige template Weiter
  • #1

    Darstellungsproblem IE 6 gegenüber Firefox

    Hi, hab ein riesen Problem, ich habe eine webasierte
    Datenbank entwickelt. Den Menüaufbau hab ich mit CSS
    verwirklicht, leider klappt der Aufbau nur beim Firefox perfekt
    und beim IE nicht. Hoffe ich könnt mir helfen (seht euch die
    beiden Bilder). Danke im Vorraus.

    Der CSS-Code:

    Code:
    #menu { width: 100%; background: #5E68AF; float: none;  }

#menu ul { list-style: none; margin: 0; padding: 0; width: 150px; float: left; }

#menu a, #menu h2
  { font: bold 11px/16px arial, helvetica, sans-serif;
  display: block; border-width: 1px; border-style: solid;
  border-color: #ccc #888 #555 #bbb;
  margin: 0; padding: 2px 3px;}

#menu h2 { color: #FFFFFF; background: #000000 text-transform: uppercase; text-align:center; }

#menu a {  color:#FFFFFF ; background:#000000 ; text-decoration: none; }

#menu a:hover { color: #000000; background: #FFFFFF; }

#menu li {position: relative; }

#menu ul ul { position: absolute; z-index: 500;  background: #000000; text-align:left; }

#menu ul ul ul { position: absolute; top: 0; left: 100%; text-align:left;}

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
  {display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
  {display: block;}



#menu1 { width: 100%; background: #5E68AF; float: none; }

#menu1 ul { list-style: none; margin: 0; padding: 0; width: 150px; float: left; text-align:center;  }



#menu1 h2 { font: bold 11px/16px arial, helvetica, sans-serif;
  border-width: 1px; border-style: solid;
  border-color: #ccc #888 #555 #bbb;
  margin: 0; padding: 2px 3px; color: #FFFFFF; background: #5E68AF text-transform: uppercase; }

#menu1 a { font: bold 11px/16px arial, helvetica, sans-serif;
   border-width: 1px; border-style: solid;
   border-color: #5E68AF;
   margin: 0; padding: 2px 3px;
   color:#FFFFFF ; background:#5E68AF ; text-decoration: none; }

#menu1 a:hover { color: #000000; background: #FFFFFF; }






#menu2 { width: 100%; background: #5E68AF; float: none; }

#menu2 ul { list-style: none; margin: ; padding: 10; width: 170px; float: left; text-align:center;  }



#menu2 h2 { font: bold 18px/20px arial, helvetica, sans-serif;
  border-width: 1px; border-style: solid;
  border-color: #ccc #888 #555 #bbb;
  margin: 0; padding: 5px 7px; color: #FFFFFF; background: #5E68AF text-transform: uppercase; }

#menu2 a { font: bold 18px/20px arial, helvetica, sans-serif;
   border-width: 1px; border-style: solid;
   border-color: #5E68AF;
   margin: 0; padding: 3px 5px;
   color:#FFFFFF ; background:#5E68AF ; text-decoration: none; }

#menu2 a:hover { color: #000000; background: #FFFFFF; }
    Zum Anschauen:
    IE6

    Firefox
    Stichworte: -
  • #2
    und wie sieht der html-code aus? mal den w3c validator bemüht? gibt es eine online-version?

    gruß
    peter
    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
    Meine Seite

    Kommentar

    • #3
      So sieht der HTML-Code aus (mit ein wenig PHP drin)

      PHP-Code:
      <?php


      if($_GET['type']==1){
      $type="1";
      echo       '
      <html>
       <head>
       <title>'      .$titel.'</title>
        <link rel="stylesheet" type="text/css" href="../format.css">

        <img src="../banner.jpg" width="100%"  alt="banner">
       </head>
       <body bgcolor="#5E68AF">
       <table width="100%"><tr>
        <td width="22%">&nbsp;</td>
        <td>
         <div id="menu2">
          <ul><li><h2><a href="../Ziehprotokoll/ZP_Start.php?type=1">Zieh-Protokoll</a></li></h2></ul>
          <ul><li><h2><a href="../ITW_Protokoll/VP_Start_RA.php?type=1">ITW-Ringanfang</a></li></h2></ul>
          <ul><li><h2><a href="../ITW_Protokoll/VP_Start_RE.php?type=1">ITW-Ringende</a></li></h2></ul>
         </div></td>
       '      ;

      }
      else{
      echo       '
      <html>
       <head>
       <title>'      .$titel.'</title>
        <link rel="stylesheet" type="text/css" href="../format.css">

        <img src="../banner.jpg" width="100%"  alt="banner">
       </head>
       <body bgcolor="#5E68AF">
       <table width="100%"><tr><td width="4%">&nbsp;</td>

         <td>
      <div id="menu1">
      <ul>
      <li>'      ;


      if (!      logged_in()){
          echo       '<h2><a href="../Admin/login.php">Login</a></h2></li>';
          }
      else {echo       '<h2><a href="../Admin/logout.php">Logout</a></h2></li>';
      }
      echo      '
       </ul>
      <ul>
       <li><h2><a href="../Fertigungsauftrag/FA_Start.php">Fertigungsauftrag</a></h2></li>
       </ul>
      </div>
      <div id="menu">
      <ul>
      <li><h2>Protokolle</h2>
       <ul><li><a href="../Ziehprotokoll/ZP_Start.php">Zieh-Protokoll</a></li>
           <li><a>ITW-Protokoll</a>
           <ul><li><a href="../ITW_Protokoll/VP_Start_RA.php">Ringanfang</a></li>
               <li><a href="../ITW_Protokoll/VP_Start_RE.php">Ringende</a></li>
       </ul>
       </li>
       </ul>
       </li>
      </ul>
      <ul>
      <li><h2>Zeiterfassung</h2>
       <ul><li><a href="../Abfragen/zeit_ziehen.php">Zeiterfassung ZM</a></li>
           <li><a href="../Abfragen/zeit_itw.php">Zeiterfassung ITW</a></li>
       </ul>
       </li>
      </ul>
      <ul>
      <li><h2>Abfragen</h2> <ul>
          <li><a href="../Abfragen/C_R_Uebersicht.php">Charge-Ring-&Uuml;bersicht</a></li>
          <li><a href="../Abfragen/Start_ZM_Uebersicht.php">ZM_Uebersicht</a></li>
          <li><a href="../Abfragen/ITW_Uebersicht.php">ITW-&Uuml;bersicht</a></li>
          <li><a href="../Abfragen/Chargenr.php">Chargenr&uuml;ckverfolgung</a></li>
          <li><a href="../Abfragen/Schrott_Start.php">Schrottzahlen</a></li>
          <li><a href="../Abfragen/Start_Stops_Charge.php">Stops je Charge</a></li>
          <li><a href="../Abfragen/Start_Abmessung.php">Stops je Abmessung und Charge</a></li>
          <li><a href="../Abfragen/Start_Stops_Lieferant.php">Stops je Lieferant</a></li>
          <li><a href="../Abfragen/GEFF_ITW.php">GEFF-ITW</a></li>
          <li><a href="../Abfragen/GEFF_Ziehen.php">GEFF-Ziehen</a></li>
       </ul>
       </li>
      </ul>
      <ul>
      <li><h2>Admin</h2><ul>
          <li><a href="../Admin/Kunden.php">Kunden&uuml;bersicht</a></li>
          <li><a href="../Admin/Lieferant.php">Lieferanten&uuml;bersicht</a></li>
          <li><a href="../Admin/ZM.php">ZM-&Uuml;bersicht</a></li>
          <li><a href="../Admin/ITW.php">ITW-&Uuml;bersicht</a></li>
          <li><a href="../Admin/ITW_Art.php">ITW-Art-&Uuml;bersicht</a></li>
          <li><a href="../Admin/fertigungsklasse.php">FK-&Uuml;bersicht</a></li>
          <li><a href="../Admin/Geff_Vorgabe_Ziehen.php">GEFF-Vorgabe-Ziehanlage</a></li>
          <li><a href="../Admin/Geff_Vorgabe_ITW.php">GEFF-Vorgabe-ITW</a></li>
          <li><a href="../Admin/Benutzerverwaltung.php">Benutzerverwaltung</a></li>
       </ul>
       </li>
      </ul>

       </li>
      </ul>
      </div>
      </td></tr></table>
      '      ;
      }
      ?>

      Kommentar

      • #4
        Der Validator bringt folgende Codes, online ist die Seite nicht...

        # Error Line 1 column 0: character "#" not allowed in prolog.

        #menu { width: 100%; background: #5E68AF; float: none; }

        ✉
        # Error Line 8 column 2: character "b" not allowed in prolog.

        border-color: #ccc #888 #555 #bbb;

        ✉
        # Error Line 17 column 0: character "#" not allowed in prolog.

        #menu li {position: relative; }

        ✉
        # Error Line 26 column 2: character "{" not allowed in prolog.

        {display: none;}

        ✉
        # Error Line 41 column 0: character "#" not allowed in prolog.

        #menu1 h2 { font: bold 11px/16px arial, helvetica, sans-serif;

        ✉
        # Error Line 47 column 3: character "b" not allowed in prolog.

        border-width: 1px; border-style: solid;

        ✉
        # Error Line 61 column 0: character "#" not allowed in prolog.

        #menu2 ul { list-style: none; margin: ; padding: 10; width: 170px; float: left;

        ✉
        # Error Line 68 column 2: character "m" not allowed in prolog.

        margin: 0; padding: 5px 7px; color: #FFFFFF; background: #5E68AF text-transfor

        ✉
        # Error Line 74 column 3: character "c" not allowed in prolog.

        color:#FFFFFF ; background:#5E68AF ; text-decoration: none; }

        ✉
        # Error Line 86 column 0: this is not an SGML document.

        .beschriftung { text-align:center; color: #FFFFFF; background-color:#5E68AF;..

        ✉
        # Error Line 86 column 0: cannot continue because of previous errors.

        .beschriftung { text-align:center; color: #FFFFFF; background-color:#5E68AF;..



        Habe die Struktur von www.drweb.de, hab eigentlich gedacht, dass das Menü klappt, nun muss ich teueres Leergeld zahlen. Hab nämlich nicht wirklich Plan von CSS.

        Kommentar

        • #5
          Hab nämlich nicht wirklich Plan von CSS.
          und dr. web wohl auch nicht:
          PHP-Code:
          div#menu ul li:hover ul,
          div#menu ul ul li:hover ul,
          div#menu ul ul ul li:hover ul
          {display: block;} 
          funktioniert im ie 6 schon mal garnicht, weil der nur auf a:hover reagiert.

          Hab nämlich nicht wirklich Plan von CSS.
          tipp, lernen. in diesem css-chaos den fehler zu finden, das dauert.

          gruß
          peter
          Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
          Meine Seite

          Kommentar

          • #6
            Zum Lernen:

            CSS4You

            Fertige Menü's finden sich außerdem en masse im Netz, z. B. hier:

            http://www.cssplay.co.uk/menus/menueleven.html

            Gruß
            Chris
            Das Genie überblickt das Chaos!

            Wer Rechtschreibfehler findet, darf sie behalten!

            Kommentar

            Vorherige template Weiter
            Lädt...
            X