Die Input's wollen nicht in die Mitte

united-King · 26 Juli 2015

Erstmal guten Morgen,

Aus irgendeinem Grund wollen die Input's nicht in die Mitte. Es ist in einer Section, und die Section ist mit margin:0 Auto; und text-align:Center; eingetragen. Die Box wird mittig gestellt bzw. positioniert aber nicht die Inputs

Falls ihr mehr Information braucht:

Die Datei/Der Code in HTML

HTML:

<section id="registrieren">

<section>
<h2>Registrieren</h2>
<h3>Kostenlos Anmelden und ein Teil der Community werden!</h3>

<p><input name="username" size="25" placeholder="Username"> <input name="email" size="25" placeholder="E-Mail Adresse"></p>
<p><input type="passsword" name="password" size="25" placeholder="Passwort"> <input type="password" name="passwdh" size="25" placeholder="Passwort Wiederholen"></p>
<p><input name="vorname" size="25" placeholder="Vorname"> <input name="nachname" size="25" placeholder="Nachname"></p>
<p><input type="checkbox" name="agb"> AGB <?php echo " &nbsp; "?> Hiermit bestätigen Sie unsere Allgemeine Geschäftsbedingung</p>
<p><input type="submit" value="Absenden"> <input type="submit" value="Zur&uuml;ck setzen"></p>


</section>


</section>

In Css:

Code:

#registrieren {
width:100%;
background:#fff;
margin:0 auto;
padding:0px;
overflow:hidden;
text-align:center;
}

#registrieren h2 {
color:#444;
}

#registrieren h3 {
color:#777;
}

#registrieren section {
width:1300px;
margin:10px auto;
padding:5px;
background:#fff;
border:2px solid #eee;
text-align:center;
}

#registrieren section input {
padding:5px;
}

MrMurphy · 26 Juli 2015

Hallo,

wenn ich mir aus deinen Angaben eine komplette Seite erstelle werden die inputs zentriert dargestellt, jeweils zwei nebeneinander.

Entweder habe ich dein Problem nicht verstanden oder es liegt an einer Stelle im Quellcode, den du uns hier vorenthälst.

Gruss

MrMurphy

united-King · 26 Juli 2015

Code:

body {
margin:0;
padding:0;
background:#eee;
}

header {
display:table;
width:100%;
padding:0;
margin:0 auto;
background:#fff;
border-bottom:1px solid #eee;
box-shadow:0px 0px 10px #333;
}

header h1 {
display:table-cell;
width:33.3%;
padding:5px;
}

header nav {
display:table-cell;
width:33.3%;
padding:5px;
text-align:center;
}

header nav li {
display:inline;
}

header nav a:hover {
color:#222;
}


header p {
display:table-cell;
width:33.3%;
text-align:right;
}

header .log {
border:1px solid #888;
color:#555;
padding:7px;
font-family:tahoma;
}

header .log:hover {
border:1px solid #555;
color:#333;
}

.container {
width:1300px;
margin-left:auto;
margin-right:auto;
}

#main {
width:100%;
background:#fff;
margin:0;
padding:0;
overflow:hidden;
}

#main section {
display:inline-block;
width:46.5%;
background:#fff;
margin:12px auto;
padding:12px;
text-align:center;
}
[LIST=1]
[*]--- und das halt von der Input Box so ist es vollständig bei mir --

[*]#registrieren {
[*]width:100%;
[*]background:#fff;
[*]margin:0 auto;
[*]padding:0px;
[*]overflow:hidden;
[*]text-align:center;
[*]}
[*]

[*]#registrieren h2 {
[*]color:#444;
[*]}
[*]

[*]#registrieren h3 {
[*]color:#777;
[*]}
[*]

[*]#registrieren section {
[*]width:1300px;
[*]margin:10px auto;
[*]padding:5px;
[*]background:#fff;
[*]border:2px solid #eee;
[*]text-align:center;
[*]}
[*]

[*]#registrieren section input {
[*]padding:5px;
[*]}
[/LIST]

Vollständiger HTML Code

HTML:

<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
<title> Homepage </title>
</head>

<body>

<header>
<div class="container">
<h1>Homepage</h1>
<nav>
<ul>
<li><a href="#">Startseite</a></li>
<li><a href="#">Galerie</a></li>
<li><a href="#">Newsletter</a></li>
</ul>
</nav>
</div>
</header>

[LIST=1]
[*]<section id="registrieren">
[*]

[*]<section>
[*]<h2>Registrieren</h2>
[*]<h3>Kostenlos Anmelden und ein Teil der Community werden!</h3>
[*]

[*]<p><input name="username" size="25" placeholder="Username"> <input name="email" size="25" placeholder="E-Mail Adresse"></p>
[*]<p><input type="passsword" name="password" size="25" placeholder="Passwort"> <input type="password" name="passwdh" size="25" placeholder="Passwort Wiederholen"></p>
[*]<p><input name="vorname" size="25" placeholder="Vorname"> <input name="nachname" size="25" placeholder="Nachname"></p>
[*]<p><input type="checkbox" name="agb"> AGB <?php echo " &nbsp; "?> Hiermit bestätigen Sie unsere Allgemeine Geschäftsbedingung</p>
[*]<p><input type="submit" value="Absenden"> <input type="submit" value="Zur&uuml;ck setzen"></p>
[*]

[*]

[*]</section>
[*]

[*]

[*]</section>
[*]
[/LIST]

Die Input's wollen nicht in die Mitte

united-King

Neues Mitglied

MrMurphy

Senior HTML'ler

united-King

Neues Mitglied

Neueste Beiträge