Anzeige

[Gelöst] CSS Navigation, Fehler im IE

[Gelöst] CSS Navigation, Fehler im IE | PSD-Tutorials.de

Erstellt von lomion, 17.12.2006.

  1. lomion

    lomion Aktives Mitglied

    Dabei seit:
    25.07.2005
    Beiträge:
    1.043
    Geschlecht:
    männlich
    [Gelöst] CSS Navigation, Fehler im IE
    Hallo Leute,
    habe mal wieder ein kleines Problem.
    Es geht um folgende Webseite: Link

    Im FF und in Opera funktioniert das Menü einwandfrei, aber der IE zeigt ein paar sehr interessante Fehler an, die eigentlich keine Fehler sind.

    Um es euch leichter zu machen, hier zwei Screenshots:
    FF:
    [​IMG]

    IE 6:
    [​IMG]

    Mir geht es dabei nicht um die komischen Farben, sondern viel mehr um die Conditional Comments die sichtbar sind und nicht interpretiert werden.

    Aber da man ohne Quelltext nichts sagen kann kommen jetzt zwei Auszüge der Stylesheets und des Menüs:
    Stylesheet für alle Browser:
    [php:1:858279b233]#nav{width:440px; height:90px; background:#FFFFFF; padding:5px 2px 2px 2px; text-align:center; float:left;}

    /* common styling */
    .menu {font-family:Verdana, Arial, Helvetica, sans-serif; width:440px; position:relative; margin:0; font-size:11px; margin:2px 0 100px 0; z-index:100;}

    .menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000; width:90px; min-height:20px; *height:90px; text-align:center; color:#000; /*border:1px solid #fff;*/ /*background:#cccccc;*/ *line-height:20px; font-size:11px; overflow:hidden;}

    .menu ul {padding:0; margin:0; list-style-type: none;}

    .menu ul li {float:left; margin-right:0px; position:relative;}

    .menu ul li ul {display: none;}

    /* specific to non IE browsers */
    .menu ul li:hover a {color:#000; /*background:#36f;*/}

    .menu ul li:hover ul {display:block; position:absolute; top:90px; left:0; width:105px;}

    .menu ul li:hover ul li a.hide {/*background:#6a3;*/ color:#000;}

    .menu ul li:hover ul li:hover a.hide {/*background:#6fc;*/ color:#000;}

    .menu ul li:hover ul li ul {display: none;}

    .menu ul li:hover ul li a {display:block; /*background:#ddd;*/ color:#000;}

    .menu ul li:hover ul li a:hover {/*background:#6fc;*/ color:#000;}

    .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:90px; top:0;}
    .menu ul li:hover ul li:hover ul.left {left:-90px;}[/php:1:858279b233]

    Stylesheet für den IE6 und niedriger:
    [php:1:858279b233]/*------------------ dropdownmenü------------------------*/

    .menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
    .menu ul li a:hover ul li a.hide {display:none;}

    .menu ul li a:hover {color:#000; background:#36f;}
    .menu ul li a:hover ul {display:block; position:absolute; top:90px; left:0; width:90px;}
    .menu ul li a:hover ul li a.sub {background:#6a3; color:#000;}
    .menu ul li a:hover ul li a {display:block; background:#ddd; color:#000;}
    .menu ul li a:hover ul li a ul {visibility:hidden;}
    .menu ul li a:hover ul li a:hover {background:#6fc; color:#000;}
    .menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:90px; top:0; color:#000;}
    .menu ul li a:hover ul li a:hover ul.left {left:-90px;}[/php:1:858279b233]

    Und das Menü:
    [php:1:858279b233]<div class="menu">
    <ul>
    [*][​IMG]
    [*][​IMG]

    <!--[if lte IE 6]>
    <a href="#">[​IMG]
    <table><tr><td>
    <![endif]-->

    <ul>
    [*][​IMG]
    [/list]

    <!--[if lte IE6]>
    </td></tr></table>
    </a>
    <![endif]-->

    [*][​IMG]
    <!--[if lte IE 6]><a href="#">[​IMG]
    <table><tr><td>
    <![endif]-->

    <ul>
    [*][​IMG]
    <!--[if lte IE 6]>
    <a href="#" class="sub">[​IMG]
    <table><tr><td>
    <![endif]-->

    <ul>
    [*][​IMG]
    [*][​IMG]
    [/list]

    <!--[if lte IE6]>
    </td></tr></table>
    </a>
    <![endif]-->

    [*][​IMG]
    <!--[if lte IE 6]><a href="#" class="sub">[​IMG]
    <table><tr><td>
    <![endif]-->

    <ul>
    [*][​IMG]
    [*][​IMG]
    [*][​IMG]
    [/list]

    <!--[if lte IE6]>
    </td></tr></table>
    </a>
    <![endif]-->

    [/list]

    <!--[if lte IE6]>
    </td></tr></table>
    </a>
    <![endif]-->

    [*][​IMG]
    [*][​IMG]
    [*][​IMG]
    [/list]
    </div>[/php:1:858279b233]

    Ich hoffe ihr könnt mir weiterhelfen.
    Bevor ich es noch vergesse als Basis habe ich folgendes Menü benutzt:
    Link

    Gruß Lomion
     
    #1      
  2. user11

    user11 3D Aktivist

    Dabei seit:
    17.12.2005
    Beiträge:
    2.901
    Geschlecht:
    männlich
    [Gelöst] CSS Navigation, Fehler im IE
    Komische Sache. Selbst im IE 7 geht's nicht. Aber das Menü von CssPlay geht einwandfrei. Kann dir da leider auch nicht weiterhelfen.

    Will aber noch mein Senf dazu ablassen :)

    Find's im Allgemeinen sehr schön. Gefällt bifi sicher gut.

    Gruss user11
     
    #2      
  3. atkey

    atkey Noch nicht viel geschrieben

    Dabei seit:
    30.11.2006
    Beiträge:
    42
    Geschlecht:
    männlich
    Software:
    Photoshop, Dreamweaer, Flash
    [Gelöst] CSS Navigation, Fehler im IE
    du hast in manchen deiner IE abfragen folgendes stehen:

    <!--[if lte IE6]>

    es muss aber

    <!--[if lte IE 6]>

    heißen.
    Das ist mir nur aufgefallen, weil die IE Abfrage (die ja im eigentlichen Sinne ein Kommentar ist) auf der Seite sichtbar ist. Ich habe es probeweise mal so gemacht. und es sah schon gut aus. Das ausgeklappte Menü sah nur komisch aus, aber kann sein, dass ich was vergessen habe.
    Also einfach zwischen IE und 6 ein leerzeichen rein.
     
    #3      
  4. lomion

    lomion Aktives Mitglied

    Dabei seit:
    25.07.2005
    Beiträge:
    1.043
    Geschlecht:
    männlich
    [Gelöst] CSS Navigation, Fehler im IE
    *kopfschüttel*
    ich wusste es kann nur ein kleiner fehler sein.. aber das es nur das ist..ich dachte eher an ein komma oder ein falsch gesetes anführungszeichen.. aber ein leerzeichen..boah...

    vielen dank.. da wäre ich nie drauf gekommen.. danke danke danke
     
    #4      
x
×
×