3-Spalten-Modell Höhe einstellen

M

MaxMustermann

Mitglied
Hi,

wollte bei meinem 3-Spalten-Modell, die Höhe der rechten und linken Spalte durch "height: 100%" einstellen, was aber nicht funktioniert. Wenn ich aber z.B. 500px schreibe, funktioniert es... woran kann das liegen?

Codeausschnitt:

Code: 
<!DOCTYPE html>

<html>
   <head>
     <title>Mein Hotel</title>
     <link rel ="stylesheet" type="text/css" href="Css/Style-Homepage.css"/>
    
     <!-- Start WOWSlider.com HEAD section -->
       <link rel="stylesheet" type="text/css" href="engine1/style.css" />
       <script type="text/javascript" src="engine1/jquery.js"></script>
     <!-- End WOWSlider.com HEAD section -->
    
   </head>
  
   <body>
     <link href='https://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
     <div id="links"><img src="Bilder/Hotel_Logo.png" alt=""></div>
     <div id="rechts"><img src="Bilder/Hotel_Logo.png" alt=""></div>
  </body>

</html>

Code: 
ks {
   height: 100%;
   background-color: #848484;
   width: 220px;
   float: left;
  
}
  
#rechts {
   height: 100%;
   background-color: #848484;
   width: 220px;
   float: right;
  
}

Kann es etwas mit dem Doctype zutun haben, denn wenn ich den lösche, funktioniert es
 
Die 100% beziehen sich auf die Höhe des Elternelementes. Das ist Body und das passt seine Höhe dem Inhalt an, füllt also u. U. das Browserfenster in vertikaler Richtung nicht vollständig. Am einfachsten wird es sein, wenn Du statt % Viewport Units benutzt: height: 100vh;
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück