Hi zusammen,
ich habe auf einer Seite eine Menge an Formulare und die ordnen sich nicht so an wie ich das gerne hätte.
Ich bin mir nicht sicher ob dies an dem HTML Code oder an den CSS "Einstellungen" liegt.
Hier mal der HTML Code:
Hier die CSS Teile:
form{
margin-top: 30px;
float: left;
text-align: left;
margin-left: 10%;
}
p.inp{
float: left;
padding-left: 10px;
}
p.inp1{
clear: both;
float: left;
padding-left: 10px;
}
p.inp2{
float: left;
padding-left: 10px;
}
Wie es im Moment aussieht sieht man auf dem Bild im Anhang.
Wie ich es gerne hätte:
Erste Reihe: Username + Username wiederholen -> nebeneinander
Zweite Reihe: E-Mail Adresse + E-Mail Adresse wiederholen -> nebeneinander
Dritte Reihe: Passwort + Passwort wiederholen -> nebeneinander
Vierte Reihe: Vorname + Nachname -> nebeneinander
Fünfte Reihe: Alterformular
Sechste Reihe: Studiengangformular
Ich hoffe mir kann jmd. helfen
ich habe auf einer Seite eine Menge an Formulare und die ordnen sich nicht so an wie ich das gerne hätte.
Ich bin mir nicht sicher ob dies an dem HTML Code oder an den CSS "Einstellungen" liegt.
Hier mal der HTML Code:
HTML:
{% extends "layout.html" %}
{% block title %}- Userdatenverwaltung{% endblock %}
{% block body %}
<h1>Userdaten verwalten</h1>
<div>
<form action = "{{ url_for('user_verw') }}" method="post">
<div>
<p class="inp"><input type="text" name="username1" placeholder="Username" autofocus></p>
<p class="inp"><input type="text" name="username2" placeholder="Username wiederholen"></p>
</div>
<div>
<p class="inp1"><input type="email" name="email1" placeholder="E-Mail Adresse"></p>
<p class="inp1"><input type="email" name="email2" placeholder="E-Mail Adresse wiederholen"></p>
</div>
<div>
<p class="inp2"><input type="password" name="pw1" placeholder="Passwort"></p>
<p class="inp2"><input type="password" name="pw2" placeholder="Passwort wiederholen"></p>
</div>
<div>
<p class="inp"><input type="text" name="vorname" placeholder="Vorname"></p>
<p class="inp"><input type="text" name="nachname" placeholder="Nachname"></p>
</div>
<div>
<label for="name">
<input name="alter" type="number" min="1" max="120" step="1"> Jahre
</label>
</div>
<div>
<p class="inp"><input type="text" name="studiengang" placeholder="Studiengang"></p>
</div>
</form>
</div>
{% endblock %}
Hier die CSS Teile:
form{
margin-top: 30px;
float: left;
text-align: left;
margin-left: 10%;
}
p.inp{
float: left;
padding-left: 10px;
}
p.inp1{
clear: both;
float: left;
padding-left: 10px;
}
p.inp2{
float: left;
padding-left: 10px;
}
Wie es im Moment aussieht sieht man auf dem Bild im Anhang.
Wie ich es gerne hätte:
Erste Reihe: Username + Username wiederholen -> nebeneinander
Zweite Reihe: E-Mail Adresse + E-Mail Adresse wiederholen -> nebeneinander
Dritte Reihe: Passwort + Passwort wiederholen -> nebeneinander
Vierte Reihe: Vorname + Nachname -> nebeneinander
Fünfte Reihe: Alterformular
Sechste Reihe: Studiengangformular
Ich hoffe mir kann jmd. helfen