tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
4
ZUGRIFFE
749
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    Avatar von Eminem
    Eminem Eminem ist offline Mitglied Gold
    Registriert seit
    Nov 2003
    Ort
    Freiburg
    Beiträge
    152
    Also ich hab mir eine Navigation gebaut, hier folgender Code:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    
    <style type="text/css">
    <!--
    TD.linkbutton a{
        text-decoration:    none;
             margin-left:       10px;
             margin-right:      10px;
             padding-top:       2px;
             padding-bottom:        2px;
             height:            18px;
             width:         100px;
        border:         1px solid #000000;
        font-family:        tahoma, verdana, arial, helvetica;
        font-size:      12px;
        font-weight:        regular;
        text-align:     center;
        color:          #CC0000;
        background-color:   #999999;
    }
    TD.linkbutton a:hover{
        color: #ffffff;
        background-color:   #666666;
    }
    #navi {
        background-color:   #999999;
        border:         1px solid #000000;
    }
    -->
    </style>
     
     
     
    <table id="navi" border="0" width="600" height="28" cellspacing="0" cellpadding="0">
    <tr>
     <td class="linkbutton"><a href="">neuigkeiten</a></td>
     <td class="linkbutton"><a href="">produkte</a></td>
     <td class="linkbutton"><a href="">wunschliste</a></td>
     <td class="linkbutton"><a href="">philosophie</a></td>
     <td class="linkbutton"><a href="">kontakt</a></td>
     <td class="linkbutton"><a href="">impressum</a></td>
    </tr>
    </table>

    Das Problem hierbei ist, dass die Navigation nur im IE korrekt angezeigt wird? Liegt das eventuell an margin-left/right? Und was kann ich machen?
    Vielen Dank.

    MFG Eminem
    Geändert von Eminem (14.04.05 um 19:59 Uhr)
     
    Seien wir realistisch, versuchen wir das Unmögliche...
    Ernesto Che Guevara

  2. #2
    Maik Tutorials.de Gastzugang
    Entferne mal das doppelte <!-- aus dem CSS-Code

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    
    style type="text/css">
    <!--
    TD.linkbutton a{
        text-decoration:    none;
             margin-left:       10px;
             margin-right:      10px;
             padding-top:       2px;
             padding-bottom:        2px;
             height:            18px;
             width:         100px;
        border:         1px solid #000000;
        font-family:        tahoma, verdana, arial, helvetica;
        font-size:      12px;
        font-weight:        regular;
        text-align:     center;
        color:          #CC0000;
        background-color:   #999999;
    }
    TD.linkbutton a:hover{
        color: #ffffff;
        background-color:   #666666;
    }
    [COLOR=Red]<!--[/COLOR] 
    #navi {
        background-color:   #999999;
        border:         1px solid #000000;
    }
    -->
    </style>
     

  3. #3
    Avatar von T3ch
    T3ch T3ch ist offline Mitglied Gold
    Registriert seit
    Mar 2005
    Beiträge
    210
    Das Problem hierbei ist, dass die Navigation nur im IE korrekt angezeigt wird?
    Ich glaube, dass das Problem ist, dass der IE es falsch anzeigt...
    Du hast da einen kleinen Rechenfehler
    Mit sechs tds à 126px (width+margin+padding) kommst du auf 756px. Genau die zeigt der IE an, obwohl du der Tabelle nur 600px (100px à td) zugewiesen hast.
    Also musst du nur die Größen der tds oder die Größe der Tabelle ändern.

    Greetz

    edit: kommst doch auf 120 px pro td; hatte mich mit den paddings+border vertan
    Geändert von T3ch (14.04.05 um 20:10 Uhr)
     

  4. #4
    Avatar von Eminem
    Eminem Eminem ist offline Mitglied Gold
    Registriert seit
    Nov 2003
    Ort
    Freiburg
    Beiträge
    152
    Vielen Dank, das wars, hat geholfen

    MFG Eminem
     
    Seien wir realistisch, versuchen wir das Unmögliche...
    Ernesto Che Guevara

  5. #5
    Maik Tutorials.de Gastzugang
    Wenn die Links die Eigenschaft display: block erhalten, übernehmen FF & CO die Weitenangabe, sowie die margin- und padding-Angaben:

    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
              "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <title></title>
    
    <style type="text/css">
    <!--
    TD.linkbutton a{
            text-decoration:        none;
             margin-left:                10px;
             margin-right:                10px;
             padding-top:                2px;
             padding-bottom:                2px;
             height:                        18px;
             width:                        100px;
            border:                        1px solid #000000;
            font-family:                tahoma, verdana, arial, helvetica;
            font-size:                12px;
            font-weight:                regular;
            text-align:                center;
            color:                        #CC0000;
            background-color:        #999999;
            display: block;
    }
    TD.linkbutton a:hover{
            color: #ffffff;
            background-color:        #666666;
            display: block;
    }
    
    #navi {
            background-color:        #999999;
            border:                        1px solid #000000;
    }
    -->
    </style>
    
    </head>
    <body>
    
    <table id="navi" border="0" width="600" height="28" cellspacing="0" cellpadding="0">
    <tr>
     <td class="linkbutton"><a href="">neuigkeiten</a></td>
     <td class="linkbutton"><a href="">produkte</a></td>
     <td class="linkbutton"><a href="">wunschliste</a></td>
     <td class="linkbutton"><a href="">philosophie</a></td>
     <td class="linkbutton"><a href="">kontakt</a></td>
     <td class="linkbutton"><a href="">impressum</a></td>
    </tr>
    </table>
    
    </body>
    </html>
    [ Browsercheck: FF 1.0.2, IE 6.0, MOZ 1.6, NN 7.0, OP 7.23 ]
     

Ähnliche Themen

  1. padding-right funktioniert nicht
    Von Pixel-Design im Forum CSS
    Antworten: 13
    Letzter Beitrag: 27.08.10, 02:49
  2. Padding funktioniert nur halb
    Von ray2mi im Forum CSS
    Antworten: 5
    Letzter Beitrag: 04.08.09, 15:56
  3. Antworten: 8
    Letzter Beitrag: 28.10.05, 08:02
  4. padding-top und padding-bottom Problem
    Von kalfany im Forum CSS
    Antworten: 4
    Letzter Beitrag: 12.03.05, 13:35
  5. Padding-top, Padding-left
    Von Fanatico im Forum CSS
    Antworten: 7
    Letzter Beitrag: 21.06.04, 16:52