Ergebnis 1 bis 4 von 4

Thema: CSS Browserhöhe anpassen

  1. #1
    HTML Newbie
    Registriert seit
    22.01.2015
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Frage CSS Browserhöhe anpassen

    Hallo liebe Leute.
    Ich habe ein Problem bezüglich einer Homepage die ich erstellen möchte.
    Ich möchte, dass meine Homepage sich in der Länge dem Browser des Nutzers anpasst.

    Nach Tagelangen suchen und hunderten getesteten Möglichkeiten bin ich zu dem Entschluss gekommen, meine Frage hier zu veröffentlichen.
    Wie schaffe ich es, dass meine Seite sich in der Länge an den Browser des Nutzers anpasst.
    Nur der "Frame" #main_1 soll sich in der Höhe anpassen. Der Rest soll konstant bleiben.
    Es Funktioniert auch alles, nur nicht die Anpassung von #main_1.

    Vielen Dank im voraus


    Code:
    <!doctype html>
    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="formate.css">
    <?php 
    //include("inhalt.php");
    ?>
    <meta charset="utf-8">
    <title>Frage</title>
    
    <style type="text/css">
     
    html,body {
        margin:0;
        padding:0;
       min-height: 100%;
       height:auto !important;
       height:100%;
        /*height:600px; /* braucht es für die min-height des Containers */
    }
    #container {
    width: 1140px;
    margin: 1px auto;
    padding: 0 42px;
       min-height: 100%;
       height:auto !important;
       height:100%;
    /*height:auto !important;*/
    /*background-repeat: no-repeat;
    background-position: center 0px;
    position:relative;*/
    }
     
    #header_oben {
     background-image:url(Bilder/header_oben.gif);
     float:left;
     width:1140px;
     height:200px;
    }
    
    #header_links{
     background-image: url(Bilder/header_links.gif);
     width: 600px;
     height: 114px;
     float: left;
    }
     
    #header_unten_2 {
     width: 120px;
     height:52px;
     float:left;
     background-image:url(Bilder/header_unten_2.gif);
    }
    #links_2 {
     width: 420px;
     height: 52px;
     background-image: url(Bilder/links_2.gif);
     float: left;
    }
    
    #main_3{
     width:540px;
     height:62px;
     background-image:url(Bilder/main_3.gif);
     float:left;
    }
     
    #main_1 {
     width: 1140px;
     /*height:686px;*/
     /*height:600px;*/
       /*min-height: 100%;
       height:auto !important;*/
       height:100%;
     background-image: url(Bilder/main_1.gif);
     float: left;
    }
    #unten_rand {
     width:1140px;
     height:1px;
     background-image:url(Bilder/unten_rand.gif);
     float:left;
    }
    #bg{
     width:100%;
     height:100%;
    }
    body {
     background-image: url(Bilder/bg/bg.png);
     background-color: #8E8E8E;
        min-height: 100%;
       height:auto !important;
       height:100%;
    }
    </style>
    <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
    </head>
    <body height="100%">
    <!--container--><div id="container">
    <!--rand_links--><div id="header_oben">
      <table width="200" border="0">
        <tbody>
          <tr>
            <td height="82"></td>
            </tr>
          <tr>
            <td height="104" align="left" valign="bottom"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1135" height="112" align="left" id="FlashID" title="">
              <param name="movie" value="Dateien/flash_animation_1.swf"/>
              <param name="quality" value="high" />
              <param name="wmode" value="transparent" />
              <param name="swfversion" value="11.2.0.0" />
              <!-- Dieses param-Tag fordert Benutzer von Flash Player 6.0 r65 und höher auf, die aktuelle Version von Flash Player herunterzuladen. Wenn Sie nicht wünschen, dass die Benutzer diese Aufforderung sehen, löschen Sie dieses Tag. -->
              <param name="expressinstall" value="Scripts/expressInstall.swf" />
              <!-- Das nächste Objekt-Tag ist für Nicht-IE-Browser vorgesehen. Blenden Sie es daher mit IECC in IE aus. -->
              <!--[if !IE]>-->
              <object data="Dateien/flash_animation_2.swf" type="application/x-shockwave-flash" width="1135" height="112" align="left">
                <!--<![endif]-->
                <param name="quality" value="high" />
                <param name="wmode" value="transparent" />
                <param name="swfversion" value="11.2.0.0" />
                <param name="expressinstall" value="Scripts/expressInstall.swf" />
                <!-- Im Browser wird für Benutzer von Flash Player 6.0 und älteren Versionen der folgende alternative Inhalt angezeigt. -->
                <div>
                  <h4>Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.</h4>
                  <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/d...ash_player.gif" alt="Adobe Flash Player herunterladen" width="112" height="33" /></a></p>
                </div>
                <!--[if !IE]>-->
              </object>
              <!--<![endif]-->
        </object></td>
            </tr>
          <tr>
            
            </tr>
        </tbody>
      </table></div>
    <div id="header_links"><table width="494" height="132" border="0" align="left">
      <tbody>
        <tr>
          <td width="110" align="left" valign="top" height="10">
          
                </td>
          <td width="131"></td>
          <td width="114">&nbsp;</td>
          <td width="121">&nbsp;</td>
        </tr>
        <tr>
          <td height="4"><div id="menu">
          <div class="inhalt">
          <ul>
           <li><a href="inc/aktuelles.php" target="iframe">Aktuelles</a>
            <ul>
             <li><a href="inc/aktionen.php" target="iframe">Aktionen</a></li>
             <li><a href="inc/stellen.php" target="iframe">Stellen-<br>ausschreibungen</a></li>
                                        <li><a href="inc/downloads.php" target="iframe">Download-Center</a></li>
                                        <li><a href="..." target="_blank">Facebook</a></li>                                    
            </ul>
           </li>
                              </ul>
                    </div>
                                </div>
                                
                                
                </td>
          <td height="10" rowspan="2"><div id="menu">
        <div class="inhalt">
          <ul>
           <li><a href="inc/leistungen.php" target="iframe">Leistungen</a>
            <ul>
             <li><a href="inc/vertrieb.php" target="iframe">Vertrieb</a></li>
             <li><a href="inc/aggregate.php" target="iframe">Aggregatebau</a></li>
             <li><a href="inc/reparatur.php" target="iframe">Reparaturen</a></li>
            </ul>
           </li>
                      </ul>
        </div>
          </div></td>
          <td rowspan="3" valign="top"><br><br>
            <div id="menu">
          <div class="inhalt">
          <ul>
           <li><a href="inc/produkte_index.php" target="iframe">Produkte</a>
            <ul>
             <li><a href="inc/....php" target="iframe">...</a>&ensp;&ensp;&ensp;&ensp;&ensp;&rArr;
                                        <ul>
                                          <li><a href="inc/.../....php" target="iframe">Antriebe</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Druckluftaufbereitung</a></li>
                                          <li><a href="inc/.../....php" target="iframe">Verschraubungen</a></li>
                                          <li><a href="inc/.../....php" target="iframe">Druckschalter</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Vakuum</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Ventile</a></li>
                                        </ul>
                                        </li>
             <li><a href="inc/.../....php" target="iframe">...</a>&ensp;&ensp;&ensp;&ensp;&ensp;&rArr;
                                         <ul>
                                             <li><a href="inc/.../....php" target="iframe">Pumpen</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Motoren</a></li>
                                          <li><a href="inc/.../....php" target="iframe">Zylinder</a></li>
                                          <li><a href="inc/.../....php" target="iframe">Schaltventile</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Stetigventile</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Steuerblöcke und Platten</a></li>
                                             <li><a href="inc/.../....php" target="iframe">Filter</a></li>
                                            </ul>
                                        </li>
                                        
                                        
             <li><a href="inc/....php" target="iframe">Hydraulik-<br>verschraubungen</a></li>
             <li><a href="inc/.../....php" target="iframe">...</a>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&rArr;
                                         <ul>
                                             <li><a href="inc/.../....php" target="iframe">Schellen</a></li>
                                             <li><a href="inc/.../....php" target="iframe">Test</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Filtration<br>Technologie</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Diagtronics</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Hydraulikzubehör</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Ventile</a></li>
                                                <li><a href="inc/.../....php" target="iframe">Fluid Connectors</a></li>
                                            </ul>
                                        <li><a href="inc/AAA.php" target="iframe">AAA</a></li>
                                        <li><a href="inc/BBB.php" target="iframe">BBB</a></li>
                                        <li><a href="inc/schlauch.php" target="iframe">Schläuche</a></li>
                                        <li><a href="inc/produkte.php" target="iframe"><strong>Katalog</strong></a></li>
            </ul>
           </li>
                              </ul>
                    </div>
                </div></td>
          <td height="4" align="center" valign="top"><h3><a href="inc/partner.php" target="iframe">Partner</a></h3></td>
        </tr>
        <tr>
          <td height="4">&nbsp;</td>
          <td height="4" align="center" valign="top">&nbsp;</td>
        </tr>
        <tr>
          <td height="52">&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
      </tbody>
    </table></div>
    
    <!--header--><div id="header_unten_2"></div>
    <!--header--><div id="links_2"><table width="316" height="50" border="0" align="right">
      <tbody>
        <tr>
          <td width="83" align="center" valign="bottom">&nbsp;</td>
          <td width="9" align="center" valign="bottom">&nbsp;</td>
          <td width="80" align="center" valign="bottom">&nbsp;</td>
          <td width="1">&nbsp;</td>
          <td width="104" valign="bottom">&nbsp;</td>
          <td width="13">&nbsp;</td>
        </tr>
        <tr>
          <td align="center" valign="bottom"><a href="inc/ueberuns.php" target="iframe">Über uns</a></td>
          <td align="center" valign="bottom">&nbsp;</td>
          <td align="center" valign="bottom"><a href="inc/kontakt.php" target="iframe" onClick="iframe2.location.href='inc/_kontakt.php'">Kontakt</a></td>
          <td>&nbsp;</td>
          <td align="center" valign="bottom"><a href="inc/impressum.php" target="iframe" onClick="iframe2.location.href='inc/_impressum.php'">Impressum</a></td>
          <td>&nbsp;</td>
        </tr>
      </tbody>
    </table></div>
    <div id="main_3"></div>
    <div id="main_1"><iframe name="iframe" frameborder="0" src="inc/aktuelles.php" height="450%" width="1135px" align="top"></iframe>
    </div>
    <div id="unten_rand"></div>
    
    </div>
    <?php
    $datei = fopen("inc/counter.txt","r+");
    $counterstand = fgets($datei, 10);
    if($counterstand == "")
       {
       $counterstand = 0;
       }
    $counterstand++;
    rewind($datei);
    fwrite($datei, $counterstand);
    fclose($datei);
    ?>
    <script type="text/javascript">
    swfobject.registerObject("FlashID");
    </script>
    </Body>
    </html>
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Teeny
    Registriert seit
    11.08.2010
    Ort
    91217 Hersbruck
    Beiträge
    41
    Danke
    0
    Bekam 13 mal "Danke" in 13 Postings

    Standard AW: CSS Browserhöhe anpassen

    Bitte keine Frames und kein Tabellen-Layout mehr verwenden, die 90er sind vorbei!

    Hier findest du einige Tutorials für zeitgemäßes Webdesign: http://wiki.selfhtml.org/wiki/HTML/Tutorials

    LG Matthias

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    22.01.2015
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: CSS Browserhöhe anpassen

    Danke für den Tipp. Jedoch habe ich nicht die Zeit die Seite komplett zu überarbeiten. Gibt es hierzu auch eine Möglichkeit das Problem zu lösen?

    MfG Huhn

  4. #4
    Teeny
    Registriert seit
    11.08.2010
    Ort
    91217 Hersbruck
    Beiträge
    41
    Danke
    0
    Bekam 13 mal "Danke" in 13 Postings

    Standard AW: CSS Browserhöhe anpassen

    Dein Anliegen ist eher ungewöhnlich! Normalerweise versucht man die Seite an die BREITE anzupassen.

    Prozentangaben bei height beziehen sich immer auf den Wert der Breite.

    Guck mal hier nach vh: http://wiki.selfhtml.org/wiki/Vh#L.C3.A4ngenma.C3.9Fe

    Damit kannst Du relative Längenmaße festlegen.

    Generell sollte man aber trotzdem HTML5-Eleemnte und ein responsives Layout verwenden, da immer mehr Leute mit Smartphones ins Netz gehen

    LG Matthias

Ähnliche Themen

  1. CSS anpassen, ändern ...
    Von Web-D im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 05.12.2014, 12:21
  2. Navigation anpassen
    Von Kämpfer im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 20.10.2009, 16:27
  3. Design anpassen
    Von ich_hab_eine_frage im Forum HTML & CSS Forum
    Antworten: 13
    Letzter Beitrag: 19.10.2009, 22:35
  4. URL Struktur anpassen
    Von BenTreeser im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 08.07.2008, 01:30
  5. joomla anpassen !!!
    Von fler171087 im Forum Job Forum - Jobs für Grafiker, Programmierer und Webmaster
    Antworten: 0
    Letzter Beitrag: 10.11.2007, 17:11

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •