Hallo ihr!
Ich habe folgenes Problem, ich möchte eine Loginbox auf meiner Seite haben, das <form> tag ist dabei der container den ich auch mit einem Hintergrund versehen habe, dann möchte ich darin 2 weitere boxen haben einmal für angabe des Usernamens und PW und die andere Seite für Einstellungen wie user modus verstecken etc.
Damit die rechte Box mit den Optionen rechts ist also neben der mit den Eingaben zum einloggen floate ich die linke Boxe float:left... soweit, sogut... nach den beiden Boxen und innerhalb noch des <form> nehme ich dann ein inhaltsloses <div style="clear:both;"></div> damit die <form>-box die anderen beiden boxen umfliesst aber leider ist die Höhe der <form>-boxe dann einfach viel zu gross... wodurch wird die höhe denn nun errechnet?
klar, ich könnte jetzt einfach max-height:xxem; nehmen, aber die box soll sich dynamisch ihrem inhalt anpassen...
nochmal auf einen blick:
PS: Verwende Opera aber in anderen Brwosern ist es genauso, habe mir FAQ zu den Abstaenden durchgelesen ist auch so ohne paddings und margins...
Ich habe folgenes Problem, ich möchte eine Loginbox auf meiner Seite haben, das <form> tag ist dabei der container den ich auch mit einem Hintergrund versehen habe, dann möchte ich darin 2 weitere boxen haben einmal für angabe des Usernamens und PW und die andere Seite für Einstellungen wie user modus verstecken etc.
Damit die rechte Box mit den Optionen rechts ist also neben der mit den Eingaben zum einloggen floate ich die linke Boxe float:left... soweit, sogut... nach den beiden Boxen und innerhalb noch des <form> nehme ich dann ein inhaltsloses <div style="clear:both;"></div> damit die <form>-box die anderen beiden boxen umfliesst aber leider ist die Höhe der <form>-boxe dann einfach viel zu gross... wodurch wird die höhe denn nun errechnet?
klar, ich könnte jetzt einfach max-height:xxem; nehmen, aber die box soll sich dynamisch ihrem inhalt anpassen...
nochmal auf einen blick:
Code:
<form class="login_box" action="<?php echo $PHP_SELF; ?>" method="post" accept-charset="ISO-8859-1">
<h2><?php echo $title; ?></h2>
<div class="inputs">
<p>
<?php echo $lang['username']; ?><br />
<input type="text" name="username" />
</p>
<p>
<?php echo $lang['password']; ?><br />
<input type="password" name="password" />
</p>
<p>
<input type="submit" value="Absenden" />
<input type="reset" value="Abbrechen" />
</p>
</div>
<div class="options">
<p>
<?php echo $lang['login_forever']; ?>
<input type="checkbox" name="login_time" value="true" />
</p>
<p>
<?php echo $lang['hide_online_status']; ?>
<input type="checkbox" name="login_hide" value="true" />
</p>
<p>
<?php echo $lang['save_session_in_cookie']; ?>
<input type="checkbox" name="login_save" value="true" />
</p>
<p>
<?php echo $lang['encrypt_password']; ?>
<input type="checkbox" name="login_encrypt" value="true" />
</p>
</div>
<div style="clear:both;"></div>
</form>
und die css classes dazu:
/* login */
.login_box {
margin-left:23%;
margin-right:23%;
margin-bottom:0.5em;
background-color:#00ff00;
padding:0em;
border:1px solid black;
}
.login_box p {
margin-left:auto;
margin-right:auto;
text-align:center;
}
.login_box h2 {
background:url(images/boxbgrechts.jpg);
text-align:center;
padding:0em;
margin:0em;
margin-bottom:1em;
font-size:16px;
}
.login_box .inputs {
min-width:50%;
float:left;
background:red;
}
.login_box .options {
margin-left:50%;
min-width:45%;
border-left:groove 6px blue;
background:yellow;
}PS: Verwende Opera aber in anderen Brwosern ist es genauso, habe mir FAQ zu den Abstaenden durchgelesen ist auch so ohne paddings und margins...
