tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
4
ZUGRIFFE
390
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    sebse sebse ist offline Mitglied
    Registriert seit
    Aug 2006
    Beiträge
    12
    Hallo,
    ich habe folgendes Layout eingebaut:
    http://www.tutorials.de/forum/css/25...ifel-fast.html
    Das geht auch alles bestens mit den Bereichen.

    Nur ist nun folgendes Problem.
    Wenn im Content-Bereich der Inhalt kürzer ist als die Navigation, dann wird diese abgeschnitten auf der Höhe, auf der der Content aufhört.
    Ist der Content länger als die Navigation, dann tritt das Problem nicht auf.

    Komischer weise nur im IE6

    Hat mir da jemand nen Rat, wie ich das beheben kann?

    Danke schon mal im voraus,

    Sebastian
     

  2. #2
    versuch13 versuch13 ist offline Mitglied Brilliant
    Registriert seit
    Feb 2005
    Beiträge
    950
    Wäre hilfreich wenn du auch deinen Quelltext und dein CSS zeigen könntest. Aber jetzt einfach mal so ins blaue, gib der Navigation eine feste höhen Angabe.
     

  3. #3
    sebse sebse ist offline Mitglied
    Registriert seit
    Aug 2006
    Beiträge
    12
    Das Problem an der Navigation ist, dass die über das CMS dynamisch generiert wird und somit ne variable Höhe hat.

    Hier CSS und Template:

    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
    
     
    <!-- ###DOCUMENT_BODY### START-->
    <div id="container">
    <div id="nav">
    <div class="nav">
    <!-- ###VERTNAV### START-->
    <!-- ###VERTNAV### END-->
    </div>
    </div>
    <div id="content-head">
    </div>
    <div id="main-content">
    <div class="content">
    <!-- ###CONTENT### START-->
    <!-- ###CONTENT### END-->
    <br><br><br><br><br>
     
    </div>
    </div>
     
    <script type="text/javascript" src="http://tracking.stangermedia.net/track.70.js"></script>
    </div>
     
    <!-- ###DOCUMENT_BODY### END-->

    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
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    
    body{
        background:url(bg.jpg) 0 0 ; position:relative;
        background-repeat: no-repeat;
        background-color: White;
    }
    #container {
    }
        #nav{
           float: left;
     
     
    }
    #content-head{
            height: 215px;
            margin-left: 275px;
    }
    #main-content {
     
    }
     
    .nav{
        margin-left: 10px;
        width:250px;
        margin-top: 50px;
     
        
    }
    .nav-act a{
        width:250px;
        margin-left: 10px;
        display:block;
        background-image: url(button.gif);
        font-size: 20px;
        font-style: normal;
        font-weight: bold;
        color: #0E606B;
        background-repeat: no-repeat;
        font: normal normal Arial, Helvetica, sans-serif;
        padding-left: 14px;
        height: 57px;
        padding-top: 15px;
        text-decoration: none;
        
    }
    .nav-act-sub a{
        width:250px;
        margin-left: 10px;
        display:block;
        background-image: url(button-sub.gif);
        font-size: 20px;
        font-style: normal;
        font-weight: bold;
        color: #0E606B;
        background-repeat: no-repeat;
        font: normal normal Arial, Helvetica, sans-serif;
        padding-left: 15px;
        height: 54px;
        padding-top: 13px;
        text-decoration: none;
        }
    .content {
            /*float: left;*/ /* auskommentiert = deaktiviert */
            position:relative;
            margin-left: 295px; 
            color: #303030;
            font-size: 15px;
            font-style: normal;
            font-variant: normal;
            font-weight: normal;
            font-family: Arial, Helvetica, sans-serif;
            text-align: left;
            width: 520px;
     
    }

    Link: http://www.vision-security.de/
     

  4. #4
    Maik Tutorials.de Gastzugang
    Ich habe mal Deine Code-Angaben in ein Dokument eingefügt und im IE getestet. Bei mir wird die Navigation nicht abgeschnitten, wenn sich im Content-DIV weniger Inhalt befindet, als in der Navigation (meine Testumgebung: Win2k, IE 6.0).

    In der Navigation habe ich fünf Links und im Content-DIV zwei Textabsätze notiert, das Ergebnis kannst Du im Anhang betrachten.

    Achtung Spoiler:
    .
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken Bereich schneidet Navigation ab-25982attachment.png  
     

  5. #5
    Maik Tutorials.de Gastzugang
    Wenn ich die (überflüssigen) DIVs mit der Klasse .nav-act aus dem Quellcode nehme, und die Klasse direkt auf die Links anwende, werden sie bei mir nicht abgeschnitten.

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    
    a.nav-act{
        width:250px;
        margin-left: 10px;
        display:block;
        background-image: url(button.gif);
        font-size: 20px;
        font-style: normal;
        font-weight: bold;
        color: #0E606B;
        background-repeat: no-repeat;
        font: normal normal Arial, Helvetica, sans-serif;
        padding-left: 14px;
        height: 57px;
        padding-top: 15px;
        text-decoration: none;
    }
    HTML-Code:
    <div id="nav">
      <div class="nav">
        <a href="start.html" class="nav-act">Start</a>
        <a href="anwendungen.html" class="nav-act">Anwendungen</a>
        <a href="technik.html" class="nav-act">Technik</a>
        <a href="vermietung.html" class="nav-act">Vermietung</a>
        <a href="kontakt.html" class="nav-act">Kontakt</a>
        <a href="mitglieder.html" class="nav-act">Mitglieder</a>
        <a href="impressum.html" class="nav-act">Impressum</a>
      </div>
    </div>
     

Ähnliche Themen

  1. IE schneidet Buchstaben ab
    Von nchristoph im Forum CSS
    Antworten: 1
    Letzter Beitrag: 01.12.10, 11:14
  2. Schnittmaske schneidet immer falschen Bereich.
    Von oozaru im Forum Vektor-Programme
    Antworten: 4
    Letzter Beitrag: 14.07.10, 11:21
  3. Navigation und Content Bereich verrutschen im IE
    Von alex130 im Forum HTML & XHTML
    Antworten: 1
    Letzter Beitrag: 18.09.08, 12:12
  4. Hp Drucker schneidet Ränder ab!?
    Von Ador im Forum Hardware
    Antworten: 0
    Letzter Beitrag: 06.09.05, 18:49
  5. Schneidet Leerzeichen ab, warum?
    Von Subwoover im Forum PHP
    Antworten: 3
    Letzter Beitrag: 21.04.02, 11:40