• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

min-height: 100%

Fabiii321

Mitglied
Hallo zusammen,

ich weiß einfach nicht was da falsch sein könnte.
Ich will, dass der Container "main" immer mindestens so hoch wie der Bildschirm ist.
(Minus #header)


PHP:
<?php
/**
* Copyright (C) 2013 peredur.net
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/
include_once 'includes/db_connect.php';
include_once 'includes/functions.php';

sec_session_start();

if (login_check($mysqli) == true) {
    $logged = 'in';
} else {
    $logged = 'out';
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Login</title>
<script type="text/JavaScript" src="js/sha512.js"></script>
<script type="text/JavaScript" src="js/forms.js"></script>
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div>
<div id="header">
    <div id="header_text">123</div>
</div>

<div id="main_login">
    <div id="main-text">
    <br>
    <h1>Login</h1>
      <br>
       <?php
        if (isset($_GET['error'])) {
            echo '<p class="error">Error Logging In!</p>';
        }
        ?>
        <form action="includes/process_login.php" method="post" name="login_form">            
            Email: <input type="text" name="email" />
            Password: <input type="password"
                             name="password"
                             id="password"/>
            <input type="button"
                   value="Login"
                   onclick="formhash(this.form, this.form.password);" />
        </form>
        <br>
        <br>
        <br>
        <br>
    </div>
</div>
</div>
</body>
</html>

Code:
@charset "utf-8";
/* CSS Document */
* { margin: 0;padding: 0;border:0; }
html{
  margin: 0px;
  padding: 0px;
  height: 100%;
}
body,html {
  width:980px;
   background-color: white;
   font-size: 14px;
  margin: 0 auto;
  padding: 0px;
  height: 100%;
   }

#header {
   width: 980px;
   height: 169px;
  background-color:gray;
   background-image:url("header.png");*/
   border-bottom:1px solid gray;
   }
#main_login {
   width: 980px;
   background-color:#E0E0F8;
   text-align:center;
  height:100%;
  min-height:calc( 100% - 169px);
}
.link_normal {
   color: #666;
}
.eingabefeld {
  background:#BFC1C1;
}
.benutzername {
  display:none;
  padding-left:10px;
  color:white;
}

Vielen Dank!

Viele Grüße
Fabi
 
Werbung:
Welcher main-Container? Wenn Du HTML5 verwenden würdest könnte ich annehmen Du meinst ein <main>-Element - ist aber nicht der Fall. Ich vermute mal du meinst das Element mit der ID main_login. So wie es geschrieben ist, sollte es eigentlich passen. Für eine genaue Beurteilung wäre ein Link zur Seite hilfreich.
 
Werbung:
Dein umschließendes DIV und height:100% aus #main_login muss auch weg. Dann klappt's.
 
<body>
<div>
<div id="header">
<div id="header_text">123</div>
</div>
...
</div>
</body>
</html>

#main_login {
width: 980px;
background-color:#E0E0F8;
text-align:center;
height:100%;
min-height:calc( 100% - 169px);
}

Alles was rot markiert ist muss weg.
 
Werbung:
Zurück
Oben