• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Probleme mit float...

Status
Für weitere Antworten geschlossen.
Ups,
auch das noch.
Den Dokumententyp solltest du wirklich ändern. Auch wenn dich der IE nicht interessiert.
Der IE6 ist in den meisten Statistiken noch der geläufigste Browser.
Wenn du koslowskis Frage nicht beantworten kannst, brauchst du kein xhtml 1.1.

Durch dein Quelltext finde ich nicht richtig durch.

Floate doch alle "Spalten". Wenn du die width-Angaben von border, margin und padding trennst hast du ein Stabiles Gerüst (sogar im IE5).
Code:
<div id="header">
Kopf
</div>

<div id="navigation">
Navigation
</div>


<div id="boxen">
<div id="box1">
links
</div>
<div id="box2">
<div id="box2_border">
<h2>
<script type="text/javascript">
document.write(document.compatMode);
</script>
</h2>
<form class="login_box" action="" method="post" accept-charset="ISO-8859-1">

<fieldset class="inputs">
<p>
Username<br />
<input type="text" name="username" />
</p>
<p>
Passwort<br />
<input type="password" name="password" />
</p>
<p>
<input type="submit" value="Absenden" />
<input type="reset" value="Abbrechen" />
</p>
</fieldset>
<fieldset class="options">
<p>
Ewig eingeloggt bleiben 
<input type="checkbox" name="login_time" value="true" />
</p>
<p>
Online Status verbergen 
<input type="checkbox" name="login_hide" value="true" />
</p>
<p>
Sitzung in Cookie sichern 
<input type="checkbox" name="login_save" value="true" />
</p>
<p>
Passwort verschlüsselt übertragen 
<input type="checkbox" name="login_encrypt" value="true" />
</p>
</fieldset>
<div style="clear: both;">
</div>
</form>
</div>
</div>


<div id="box3">
box3
</div>
</div>


<div class="clearer"></div>


<div id="footer">
fuss
</div>
und
Code:
html, body {
margin: 0;
padding: 0;
}

#header {
background-color: #7B0C01;
color: #ffffff;
}

#navigation {
border-top: 1px solid #ffffff;
background-color: #7B0C01;
color: #ffffff;
}

#box1 {
width: 23%;
background-color: #5B5B5B;
color: #ffffff;
float: left;
}

#box2 {
background-image: url(http://css-spalten.red-rod.net/test/beispiel/images/formbg2000px.gif);
background-position: 50% 0;
width: 53.9%;
text-align: center;
float: left;
}

#box_border {
border: 1px solid #000000;
}

.login_box {
padding: 0 0 2em 0;
margin: 0;
}

.login_box .inputs {
float: left;
width:50%;
margin: 0;
padding: 0;
border: none;
}

.login_box .options {
float:right;
width:50%;
margin: 0;
padding: 0;
border: none;
}

#box3 {
width: 23%;
background-color: #5B5B5B;
color: #ffffff;
float: left;
}

#footer {
background-color: #5B5B5B;
color: #ffffff;
}

.clearer {
clear: both;
}

 h2 {
font-size:16px;
margin: 0;
padding-bottom: 1.2em;
background-color: #FF0000;
}
Die gleich langen Spalten kannst du mit faux columns simulieren.

"Ewig eingeloggt bleiben" kann und darf es nicht geben. Ich würde das anders beschreiben.
 
Zuletzt bearbeitet:
Status
Für weitere Antworten geschlossen.
Zurück
Oben