2
Ich versuche, die Elemente in der Mitte der Seite auszurichten. Ich benutze display: flex aber dies bewirkt, dass der Text in verschiedene Spalten aufgeteilt wird, aber ich will das nicht, ich möchte, dass der Text normal ist, weißt du. Wenn die Sitzung eingestellt ist, wird der Text angezeigt; Sie können sehen, dass die Formulare in der Mitte ausgerichtet sind, der Text jedoch nicht.Display flex bewirkt, dass Text aufgeteilt wird
* {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
letter-spacing: -0.5px;
}
html,
body {
height: 100%;
width: 100%;
background: #fff;
}
.content-container {
width: 100%;
height: auto;
padding: 10pt;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0 auto;
margin-top: 30pt;
display: flex;
justify-content: center;
}
.header {
top: 0;
position: fixed;
height: 30pt;
width: 100%;
background: rgba(255, 255, 255, 0.50);
border-bottom: 1.5px solid #0047FF;
}
.header-content {
width: 100%;
height: inherit;
margin: 0 auto;
white-space: nowrap;
line-height: 30pt;
padding: 0 5pt;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.header-menu {
border-right: 1px solid #0047FF;
margin-right: 10pt;
width: auto;
height: inherit;
float: left;
padding: 0 5pt 0 0;
}
.header-menu ul li {
list-style: none;
float: left;
}
.header-menu ul li a {
color: #555;
text-decoration: none;
padding: 0 3pt;
float: left;
}
.logout-form__ button {
background: none;
cursor: pointer;
border: none;
outline: none;
color: #555;
}
.logout-form__ button:hover {
color: #888
}
.header-menu ul li a:after {
content: "/";
padding: 0 0 0 5pt
}
.header-menu ul li:last-child a:after {
content: "";
padding: 0;
}
.header-menu ul li a:hover {
color: #888;
}
.header-menu ul li a:hover:after {
color: #555
}
.header-search form input {
border: none;
background: rgba(255, 255, 255, 0.50);
outline: none;
padding: 5pt;
border-top: 1px solid #eee;
width: 250pt;
display: inline-block;
color: #555
}
.header-search form input:focus {
border-color: #ccc;
background: rgba(255, 255, 255, 0.80)
}
.header-search form button {
background: rgba(255, 255, 255, 0.50);
border: none;
outline: none;
border-top: 1px solid #eee;
padding: 5pt;
cursor: pointer;
color: #555
}
.header-search form button:hover {
border-color: #ccc;
background: rgba(255, 255, 255, 0.60);
}
.same-form-styling {
float: left;
padding: 10pt 0;
border-bottom: 1px solid #ccc;
width: auto;
width: 400pt
}
.forms-title {
border-bottom: 1px solid #ccc;
padding: 0 0 10pt 0;
margin-bottom: 10pt
}
.forms-title span {
font-size: 16px;
}
.same-form-styling form input {
width: 100%;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10pt 0;
border: none;
outline: none;
border-bottom: 1px solid #eee;
}
.same-form-styling form button {
border: none;
outline: none;
padding: 10pt;
border-left: 1px solid #eee;
float: left;
background: none;
border-right: 1px solid #eee;
width: 150pt;
}<?php
include_once './Private/Backend/Database/conn.php';
if(isset($_POST['logout'])) {
session_destroy();
unset($_SESSION['id']);
unset($_SESSION['username']);
unset($_SESSION['email']);
header("location: index.php?a=login");
}
/* ### */
if(isset($_POST['login-btn'])) {
$l_email = mysqli_real_escape_string($main, $_POST['l-email']);
$l_email = stripcslashes($l_email);
$l_pass = mysqli_real_escape_string($main, $_POST['l-pass']);
$l_pass = stripcslashes($l_pass);
if(filter_var($l_email, FILTER_VALIDATE_EMAIL)) {
$hashed = md5(sha1(md5(sha1($l_pass))));
$sql = "SELECT * FROM accounts WHERE email='$l_email' and password='$hashed'";
$result = mysqli_query($main, $sql);
if(mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$_SESSION['id'] = $row['id'];
$_SESSION['username'] = $row['username'];
$_SESSION['email'] = $row['email'];
header("location: index.php");
}
} else {
header("location: index.php?a=login&loginErr=wrong&email=$l_email");
}
} else {
header("location: index.php?a=login&loginErr=invalidEmail&email=$l_email");
}
}
if(isset($_POST['reg-btn'])) {
$username = mysqli_real_escape_string($main, $_POST['reg-uname']);
$username = stripcslashes($username);
$username = strip_tags($username);
$email = mysqli_real_escape_string($main, $_POST['reg-email']);
$email = stripcslashes($email);
$email = strip_tags($email);
$email_c = mysqli_real_escape_string($main, $_POST['reg-c-email']);
$email_c = stripcslashes($email_c);
$pass = mysqli_real_escape_string($main, $_POST['reg-pass']);
$pass = stripcslashes($pass);
$pass_c = mysqli_real_escape_string($main, $_POST['reg-c-pass']);
$pass_c = stripcslashes($pass_c);
if(!empty($username && $email && $email_c && $pass && $pass_c)) {
$sql = "SELECT * FROM accounts WHERE username='$username'";
$result = mysqli_query($main, $sql);
if(mysqli_num_rows($result) > 0){
header("location: index.php?a=register®isterErr=userTaken&username=$username&email=$email&cEmail=$email_c");
} else {
if(filter_var($email, FILTER_VALIDATE_EMAIL)) {
if($email == $email_c) {
$sql = "SELECT * FROM accounts WHERE email='$email'";
$result = mysqli_query($main, $sql);
if(mysqli_num_rows($result) > 0) {
header("location: index.php?a=register®isterErr=emailTaken&username=$username&email=$email&cEmail=$email_c");
} else {
if(strlen($pass) >= 6) {
if($pass == $pass_c) {
$hashedBrown = md5(sha1(md5(sha1($pass))));
$sql = "INSERT INTO accounts (username, account_type, first_name, last_name, gender, bio, email, password) VALUES ('$username', 'Regular User' , '', '', '', '','$email', '$hashedBrown')";
$result = mysqli_query($main, $sql);
$sql = "SELECT * FROM accounts WHERE username='$username' and email='$email'";
$result = mysqli_query($main, $sql);
$row = mysqli_fetch_assoc($result);
$_SESSION['id'] = $row['id'];
$_SESSION['username'] = $row['username'];
$_SESSION['email'] = $row['email'];
header("location: index.php");
} else {
header("location: index.php?a=register®isterErr=passwordsDoNotMatch&username=$username&email=$email&cEmail=$email_c");
}
} else {
header("location: index.php?a=register®isterErr=passwordLen&username=$username&email=$email&cEmail=$email_c");
}
}
} else {
header("location: index.php?a=register®isterErr=emailsDoNotMatch&username=$username&email=$email&cEmail=$email_c");
}
} else {
header("location: index.php?a=register®isterErr=username=$username&email=$email&cEmail=$email_c");
}
}
} else {
header("location: index.php?a=register®isterErr=allEmpty");
}
}
?>
<!DOCTYPE html>
<html lang="en" style="overflow-x: hidden;">
<head>
<meta charset="UTF-8" />
<title>ICode Foundation</title>
<link rel="stylesheet" type="text/css" href="./Public/CSS/Beta/all.css" />
</head>
<body>
<div class="header">
<div class="header-content">
<div class="header-menu">
<ul>
<?php if(!isset($_SESSION['id'])) { ?><li><a href="index.php?a=register">Register</a></li><?php } ?>
<?php if(!isset($_SESSION['id'])) { ?><li><a href="index.php?a=login">Login</a></li><?php } ?>
<?php if(isset($_SESSION['id'])) { ?><li><a href="#">Home</a></li><?php } ?>
<?php if(isset($_SESSION['id'])) { ?><li><a href="#">You <span>(<strong><?php echo $_SESSION['username']; ?></strong>)</span></a></li><?php } ?>
<?php if(isset($_SESSION['id'])) { ?><li><a href="#">
<form action="index.php" method="POST" class="logout-form__">
<button type="submit" name="logout">
Logout
</button>
</form>
</a></li><?php } ?>
</ul>
</div>
<div class="header-search">
<form action="#" method="GET">
<input type="text" placeholder="Search" name="q" autocomplete="off" /><button type="submit" name="search-btn">Search</button>
</form>
</div>
</div>
</div>
<div class="content-container">
<?php if(!isset($_SESSION['id'])) { ?>
<?php if(isset($_GET['a'])) { ?>
<?php if($_GET['a']=="register") { ?>
<div class="register same-form-styling">
<div class="forms-title"><span>Register</span></div>
<form action="index.php" method="POST">
<input type="text" name="reg-uname" placeholder="Username" <?php if(isset($_GET['username'])) { echo 'value="' . $_GET['username'] . '"'; } ?> />
<input type="text" name="reg-email" placeholder="Email Address" <?php if(isset($_GET['email'])) { echo 'value="' . $_GET['email'] . '"'; } ?> />
<input type="text" name="reg-c-email" placeholder="Confirm Email" <?php if(isset($_GET['cEmail'])) { echo 'value="' . $_GET['cEmail'] . '"'; } ?> />
<input type="password" name="reg-pass" placeholder="Password" />
<input type="password" name="reg-c-pass" placeholder="Confirm Password" />
<button type="submit" name="reg-btn">Register</button>
</form>
<div class="register-info" style="clear:both;border-top: 1px solid #ccc;padding: 10pt 0 0 0;">You are not hindered to a specific array of characters to inlude in your password therefore, ensure your password is strong and memorable. Hindering users on what characters they can use in their password is an idiotic move hence, we don't include such feature nor endorse this practice. It is solely your fault and responsibility if your password is easily guessable.</div>
</div>
<?php } elseif($_GET['a']=="login") { ?>
<div class="login same-form-styling">
<div class="forms-title"><span>Login</span></div>
<form action="index.php" method="POST">
<input type="text" placeholder="Email" name="l-email" <?php if(isset($_GET['email'])) { echo 'value="' . $_GET['email'] . '"'; } ?> />
<input type="password" placeholder="Password" name="l-pass" />
<button type="text" name="login-btn">Login</button>
</form>
</div>
<?php } else { ?>
<div class="unknown">
Unknown operation; it's either login or register.
</div>
<?php } ?>
<?php } ?>
<?php } else { ?>
<h1>Welcome</h1>
<p>All you can do is log in, edit your profile can search, view other profiles. Functionality such as blogging is an intended feature to soon be implemented. This site will go through major updates to ensure full reliability and user usability. Other major implementations such as code integrations to advance the site's functionality is desirable however, this site shouldn't be too advanced which could lead to hindrances thinking of new concepts for future updates.</p>
<p>This site will be powered by volunteers; voluntary developers, graphic designers and other skills that are beneficially suggestive towards this project. Your skills must include an array of professional and impeccable knowledge of a broad range of subjects and that bring in a diverse array of talent of knowledge to this project to grow and enlarge the project in many different ways. If you're interested in developing the site, email the lead developer at <a href="mailto:[email protected]">[email protected]</a>. </p>
<p>You must lay your email out in a way that is comprehensible and professional. Ensure that you include your skills and how you will benefit the project in an innovative and intuitive manner. Include your programming skills and what programming languages do you know etc. Any other things that may help the project in different ways.</p>
<p>Skills like legal and business is helpful alongside impeccable English language skills. These skills will eventually contribute to administration and communicating with users to provide support wherever mandatory. You account role will fluctuate the features that you have access to; do not ask nor request roles of high rank, trusted members will be granted administration whereas moderators will be nominated based on the contributions they have made like translations etc. This is a for-profit project however, this will be a non-profitable project for the time being. </p>
<p>If you have any inquiries, questions or reports, you can contact the site's lead developer <a href="#">here</a> or you can contact another administrator <a href="#">here</a>.</p>
<p><strong>Your account could be susceptible to a susepnsion or a perminate ban if you're ever witnessed infringing our community guidelines. Review them <a href="#">here</a>. These guidelines will ensure that the tranquility is persistant throughput, which will ensure that this service is safe for everyone to use. With that stated, before pursuing, you agree that you're 13 years or older.</strong></p>
<?php } ?>
</div>
<div class="footer-wrap">
</div>
</body>
</html>
I angewendet haben die untere Auflösung, der Text ist jedoch nicht ganz normal, wie ich es möchte es sein und daher ist der untere Absatz eingerückt und der Titel ist zentriert. – Adam
spielt keine Rolle. – Adam
Nein, der Header ist in der Mitte ausgerichtet, das sieht hässlich aus. Würdest du wissen, wie man es repariert? – Adam