Anzeige

Horizontale Liste + Prob im ie

Horizontale Liste + Prob im ie | PSD-Tutorials.de

Erstellt von h4nnes, 23.10.2008.

  1. h4nnes

    h4nnes Nicht mehr ganz neu hier

    Dabei seit:
    31.05.2005
    Beiträge:
    225
    Geschlecht:
    männlich
    Software:
    Photoshop,Corel, Dreamweaver
    Kameratyp:
    Ixus 500
    Horizontale Liste + Prob im ie
    Hallo,

    ich habe derzeit ein prob mit einer Navigation. Im FF schauts gut aus, nur im ie7 (ie6 weiß ich nicht), schauts net so toll aus...

    Electronic Data Solutions Pty Ltd

    kann mir vielleicht jemand helfen?

    hier mal mein css:
    Code (Text):
    1.  
    2.  
    3. ul {
    4.     list-style: none;
    5.     margin: 0;
    6.     padding: 0;
    7.     }
    8.  
    9. #menu {
    10.     width:940px;
    11.     float:left;
    12.     font-size:14px;
    13.     height:41px;
    14.  
    15. }
    16.  
    17. /* =-=-=-=-=-=-=-[Menu Two]-=-=-=-=-=-=-=- */
    18.    
    19. #menu2 {
    20.     width: 910px;
    21.     height:41px;
    22.     padding-top: 0px;
    23.     float:left;
    24.     }
    25.    
    26. #menu2 li a {
    27.     height: 41px;
    28.     width:130px;
    29.     text-decoration: none;
    30.     padding-top: 5px;
    31.     text-align:center;
    32.     list-style:none;
    33.     }
    34.    
    35. #menu2 li a:link, #menu2 li a:visited {
    36.     color: #000;
    37.     list-style:none;
    38.     float:left;
    39.     height: 41px;
    40.     background-image: url(../images/button.jpg);
    41.     }
    42. #menu2 li a:hover {
    43.     height: 41px;
    44.     color: #810012;
    45.     background-image: url(../images/buttonH.jpg);
    46.     background-repeat: no-repeat;
    47.     }
    48.    
    49. #menu2  li  a#current{
    50.     color: #810012;
    51.     background-image: url(../images/buttonH.jpg);
    52.     background-repeat: no-repeat;
    53.     }  
    54.  
    Vielen Dank schonmal.

    Gruß Hannes
     
    #1      
  2. Top_Gun

    Top_Gun Aktives Mitglied

    Dabei seit:
    24.07.2008
    Beiträge:
    965
    Geschlecht:
    männlich
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Im IE6 ists komplett zerstückelt:

    [​IMG]
     
    #2      
  3. h4nnes

    h4nnes Nicht mehr ganz neu hier

    Dabei seit:
    31.05.2005
    Beiträge:
    225
    Geschlecht:
    männlich
    Software:
    Photoshop,Corel, Dreamweaver
    Kameratyp:
    Ixus 500
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    oh man, danke für deine schnelle Antwort. Was macht nur diese IE ???

    edit:

    Das Prob kommt von:

    #menu2 li a:link, #menu2 li a:visited {

    float:left;

    nur wenn ich diesen float entferne, dann hab ich eine Liste und keine Horizontale Navi, was kann ich da machen ?
     
    Zuletzt bearbeitet: 23.10.2008
    #3      
  4. rollo27

    rollo27 Noch nicht viel geschrieben

    Dabei seit:
    09.10.2008
    Beiträge:
    20
    Geschlecht:
    männlich
    Ort:
    Leipzig
    Software:
    Photoshop, Gimp, Corel, Inkscape...
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Auf jeden Fall vieles anders als alle anderen...

    In Deinem Fall würde ich Dich allerdings mal fragen: warum willst Du das überhaupt mit LI machen? Formatiere doch einfach die Links in menu2 (#menu2 a) mit Bildern und hover etc., und dann schreibst Du sie einfach lückenlos nebeneinander (<a...>...</a><a...></a>). Nicht untereinander, auch wenns übersichticher aussieht, aber dann hast Du immer eine "unkaputtbare" Lücke (Whitespace) dazwischen.

    LI ist für sowas nicht gemacht! Ich denke, daß das float:left hier die Schwierigkeit macht, weil es eben einfach nicht "geplant" ist, eine Liste nebeneinander zu schreiben.

    Ralph
     
    #4      
  5. h4nnes

    h4nnes Nicht mehr ganz neu hier

    Dabei seit:
    31.05.2005
    Beiträge:
    225
    Geschlecht:
    männlich
    Software:
    Photoshop,Corel, Dreamweaver
    Kameratyp:
    Ixus 500
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    okay, hab jetzt mal die Liste geändert. Im IE7 und FF schauts ganz gut aus, könnte mir bitte nochmal jemand nen Screen von IE6 zeigen? (Nachteil von Vista...)

    Danke für eure Hilfe!
     
    #5      
  6. rollo27

    rollo27 Noch nicht viel geschrieben

    Dabei seit:
    09.10.2008
    Beiträge:
    20
    Geschlecht:
    männlich
    Ort:
    Leipzig
    Software:
    Photoshop, Gimp, Corel, Inkscape...
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Mit IE6 ist es jetzt vom Aufbau her identisch mit Firefox 2.0.0.17. Screenshot spare ich mir daher :). Hat wohl geklappt! Wozu die <div>s um die <a>s? Mach menu1 zur Klasse und weise sie den <a> zu. Du darfst eine ID ohnehin nur genau 1x pro Seite verwenden (deswegen heißt es ja ID), so wie jetzt ist es nicht valide.

    Ralph
     
    Zuletzt bearbeitet: 23.10.2008
    #6      
  7. h4nnes

    h4nnes Nicht mehr ganz neu hier

    Dabei seit:
    31.05.2005
    Beiträge:
    225
    Geschlecht:
    männlich
    Software:
    Photoshop,Corel, Dreamweaver
    Kameratyp:
    Ixus 500
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    danke für deine Hilfe.
    wie kann ich denn die Klasse dann dem Link zuweisen?

    schaut ja dann so in der art aus oder?
    Code (Text):
    1.  
    2.     <div id="menu1">
    3.         <a href="index.html">Home</a>
    4.         <a href="aboutus.html" id="current">About Us</a>
    5.         <a href="productservices.html">Products &amp; Services</a>
    6.         <a href="benefits.html">Benefits</a>
    7.         <a href="support.html">Support</a>
    8.         <a href="contactus.html">Contact Us</a>
    9.         <a href="partners.html">Technical <br />
    10.         Partners</a>
    11.     </div>
    12.  
     
    #7      
  8. Top_Gun

    Top_Gun Aktives Mitglied

    Dabei seit:
    24.07.2008
    Beiträge:
    965
    Geschlecht:
    männlich
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Kann ich leider nicht bestätigen. Zwischen meinem FF 2.0.0.17 und meinem IE6 gibt es noch ein paar Differenzen. Aber die Navi passt schonmal ;)

    Im IE6 schaut es so aus:
    [​IMG]
    [​IMG]
     
    #8      
  9. rollo27

    rollo27 Noch nicht viel geschrieben

    Dabei seit:
    09.10.2008
    Beiträge:
    20
    Geschlecht:
    männlich
    Ort:
    Leipzig
    Software:
    Photoshop, Gimp, Corel, Inkscape...
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Okay, vielleicht mißverständlich ausgedrückt.

    Entweder Du machst eine Klasse .menulink (oder .menu1link, wenn Du mehrere Menüs brauchst) machen, die die <a>s im Menü wie gehabt beschreibt. Und dann eben <a class="menulink">...</a>. #menu1 ist ja eigentlich nur der Container für alle <a>, um z.B. die Lage zu bestimmen oder allgemeine Definitionen.

    Oder Du schreibst die <a>-Definitionen in "#menu1 a" (wenn Du #menu1 behalten willst), dann brauchst Du natürlich keine extra Klasse.

    Also:

    css:

    #menu1 {
    /* Definitionen für den Container */
    }
    #menu1 a {
    /* allgemein für alle Links (text-decoration, background etc.) */
    }
    #menu1 a:hover {
    /* z.B. background-Bildwechsel */
    }

    html:

    <div id="menu1"<a>...</a>...</div>

    So ist es sicher (css-technisch) am Saubersten, falls Du den #menu1-Container überhaupt brauchst. Welches Verfahren Du nimmst, ist Geschmackssache.
     
    #9      
  10. h4nnes

    h4nnes Nicht mehr ganz neu hier

    Dabei seit:
    31.05.2005
    Beiträge:
    225
    Geschlecht:
    männlich
    Software:
    Photoshop,Corel, Dreamweaver
    Kameratyp:
    Ixus 500
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    okay, das hört sich doch gut an!
    Das muss ich mal testen, hab es jetzt auch mit der Liste hinbekommen, das Problem war, dass ein #menu2 li { float:left; } gefehlt hat
     
    #10      
  11. OliverLibbertzxyz

    OliverLibbertzxyz Noch nicht viel geschrieben

    Dabei seit:
    22.06.2008
    Beiträge:
    15
    Geschlecht:
    männlich
    Horizontale Liste + Prob im ie
    AW: Horizontale Liste + Prob im ie

    Hallo, denke auch das dies die lösung ist
     
    #11      
Seobility SEO Tool
x
×
×