HD: Die Höhe eines Header-Divs and den Text darin anpassen

Beitrag lesen

SELF-Forum

Die Höhe eines Header-Divs and den Text darin anpassen

HD (Versionen)
– Informationen zu den Bewertungsregeln

Hi!

Wie kann ich denn dafür sorgen, dass der "Eingeloggt als <username>"-Text schön zentriert wird bzw das <div>-Element, in dem er sich befindet schön daran anpasst.

<!DOCTYPE HTML>

<?php

session_start();

include 'res/functions.php';

error_reporting(E_ALL ^  E_NOTICE); 

$isntactive = '';

$submyt = $_POST['submit'];

if(isset($submyt)) {

$uzernm = strip_tags($_POST['username']);


$connect = new PDO('*ausgeblendet*');

/* HIER BEREITE ICH DIE QUERIES VOR! */

$fetch = $connect->prepare("SELECT * FROM usertablex WHERE usern=:uzernm");
/* QUERIES WERDEN AUSGEFÜHRT */

$fetch->execute(array(":uzernm"=>$uzernm));
$row = $fetch->fetch(PDO::FETCH_ASSOC);
 
$pwentered = md5(strip_tags($_POST['password']));
$pwindbase = $row['passw'];
$prfid = $row['id'];

if($pwentered==$pwindbase) {

$isactive = $row['active'];

if($isactive == 1) {

$ipfetch = $_SERVER['REMOTE_ADDR'];
$updateip = $connect->prepare("UPDATE usertablex SET ipaddr=:ipaddr WHERE usern=:uzernm");
$updateip->execute(array(":uzernm"=>$uzernm, ":ipaddr"=>$ipfetch));
$_SESSION['uname'] = $uzernm;

} else {

$isntactive = 'Ihr Konto ist noch nicht aktiv! Bitte überprüfen Sie Ihr E-Mail-Postfach!';

}

} else {

  echo 'FEHLSCHLAG!';

}

}

?>

<html>
      <head>
            <title>Daniel Haider</title>
            <link rel="stylesheet" type="text/css" href="css/main.css"/>
            <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
      </head>

      <body>
        <div id="main-outer">
        <?php

            if(!$_SESSION['uname']) {

        ?> 
            <h1>Hier entsteht die Website von Daniel !</h1>
            <hr>
            <div id="logonform">
              <?php echo $isntactive; ?>
            <form name="logon" action="index.php" method="POST">
                
                <h2>Bitte loggen Sie sich ein!</h2>
                <ul>
                  <li><label for="username">Username:</label><br>
                  <input type="text" name="username" maxlength="16"></li>
                  <li><label for="password">Password:</label><br>
                  <input type="password" name="password" maxlength="16"></li>
                  <li><input type="submit" name="submit" value="Log in!"></li>
                </ul>
            </form>
            <br>
            <a href="res/md5gen.php">MD5 Converter</a><br>
            <a href="register/">Registrieren?</a>
            </div>
  
            <?php

            } else {
            
            ?>

          <div id="content">
            <!-- LOGOUT BAR -->

            <div id="memBar">
              <div id="logoutBar">
                <p class="logouttext">
            <?php
              echo 'Eingeloggt als <a href="profile.php?proid='.$prfid.'" target="_blank">' .$_SESSION['uname'].'</a> ! <a href="logout.php">Ausloggen?</a>';
              //var_dump($prfid);
            ?>
                </p>
              </div>
            </div>
          <article name="" class="content">

          </article>
          </div>
          
            <!-- END OF LOGOUT BAR -->

            <?php

            }


          ?>
        </div>
      </body>
</html>

Hier das CSS:

**************
body {
  background-color: blue;
}

#main-outer {
  background-color: rgba(255, 255, 255, 0.76);
  position: absolute;
  width: 50%;
  height: 100%;
  margin: 0;
  left: 25%;
  top: 0px;
  text-align: center;
  overflow: initial;
}

header {
  width: 100%;
  background-color: green;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  margin: 0;
  text-align: center;
}

ul {
  margin: auto 0 auto 0;
  padding: 0;
}

li {
  list-style-type: none;
  margin: 0;
  padding: 0;
  list-style-position: outside;
  text-align: center;
}

.field {

}

#memBar {

  position: absolute;
  top: 0px;
  width: 100%;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid black;
  height: 5%;
  display: flex;
  justify-content: space-between;
  align-items: center;

}

#logoutBar {
  
  position: absolute;
  margin: 0;
  padding: 0;
  right: 0px;
  height: 100%;
  display: inline;

}

.logouttext {

  margin: 0;
  padding: 0;

}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) {

body {
  background-size: auto;
}

#main-outer {

  text-align: center;
  left: 0px;
  width: 100%;
  margin: 0;
  padding: 0;

}

.headfont {
  display: inline-block;
  font-size: 3em;
}

}
–-—-—-—-—-—-

Danke im vorraus :)

Beitrag melden
–
Informationen zu den Bewertungsregeln