✔ Problem mit DIV-Boxen

[kasal]

Hallo Freunde!

Ich programmier ja grade eine Page, und habe folgendes Problem (Screenshot): Der Grünne Bereich ist der Hauptcontainer, der zu den Browserseiten margin:10% hat. Die braunen Bereiche sind Navi und Logo. Das lilane ist eine Umfrage-Box und das rote ein Login.
So, nun das Problem:
Das Login-DIV hat eine Feste größe von 200px. Der Umfrage DIV hat die Eigenschaft float:left; der Login float:right; Nun, wie bringe Ich den Umfrage-DIV dazu, den freien Bereich zwischen diesem DIV und dem Login auszufüllen, er muss Ihn bei nahezu jeder Fenstergröße ausfüllen. Die gelben Boxen sind ganz normale, die unten drunter weitergehen, haben also nichts mit dem Problem zu tun.

Hoffe Ihr könnt mir helfen.


lg,
kasal

 

[Maik]

Verwende mal folgendes Stylesheet:

div.login {
        width: 200px;
        float:right;
        background: #ff0000;
}

div.umfrage {
        margin-right: 200px;
        background: #7000c0;
}

Und notiere im HTML-Code das DIV umfrage nach dem DIV login:

<div class="login">login</div>
<div class="umfrage">umfrage</div>

 

[kasal]

Hm..

Ich poste Mal den Code:

<div style='margin-left:170px;padding:4px;'><!-- Inhaltsbox -->
<div style='float:left;margin-right:200px;margin-left:0;width:auto;'><!-- Umfrage -->
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'>Umfrage</div>
<div style='background-color:#B1B1B1;border-left:1px dashed #000000;border-right:1px dashed #000000;'>Hier den Text!dfgdfgdfgdfgdg<br><br><br><br><br><br>asdasd</div>
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'>Umfrage ende</div>
</div>
<FORM METHOD=POST ACTION="login.php" target="blank">
<div style='width:197px;position:relative;float:right;'>
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'><span style='margin-left:3px;'>Login</span></div>
<div style='background-color:#B1B1B1;border-left:1px dashed #000000;border-right:1px dashed #000000;padding-left:3px;'>
Benutzername:<br><INPUT TYPE="text" NAME="username"><br>Passwort:<br><INPUT TYPE="password" NAME="password" style='margin-bottom:3px;'></div>
<div style='border:1px solid #000000;height:20px;'>
<!-- <INPUT TYPE="image" SRC="bilder/btn_silver.PNG" style='width:195px;margin-bottom:0px;'> -->
</div></FORM></div>
</div><!-- Inhaltsbox ende -->

Ein bissel ünübersichtlich, Ich weiss..


lg,
kasel

 

[Maik]

Für eine bessere Übersicht darfst du dann selber sorgen

<div style='margin-left:170px;padding:4px;'><!-- Inhaltsbox -->

<FORM METHOD=POST ACTION="login.php" target="blank"><!-- Login -->
<div style='width:197px;position:relative;float:right;'>
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'><span style='margin-left:3px;'>Login</span></div>
<div style='background-color:#B1B1B1;border-left:1px dashed #000000;border-right:1px dashed #000000;padding-left:3px;'>
Benutzername:<br><INPUT TYPE="text" NAME="username"><br>Passwort:<br><INPUT TYPE="password" NAME="password" style='margin-bottom:3px;'></div>
<div style='border:1px solid #000000;height:20px;'>
<!-- <INPUT TYPE="image" SRC="bilder/btn_silver.PNG" style='width:195px;margin-bottom:0px;'> -->
</div></div>
</FORM>

<div style='margin-right:200px;'><!-- Umfrage -->
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'>Umfrage</div>
<div style='background-color:#B1B1B1;border-left:1px dashed #000000;border-right:1px dashed #000000;'>Hier den Text!dfgdfgdfgdfgdg<br><br><br><br><br><br>asdasd</div>
<div style='background-image:url(bilder/l1.PNG);border:1px solid #000000;'>Umfrage ende</div>
</div>

</div><!-- Inhaltsbox ende -->

 

[kasal]

Vielen Dank, Maik! ;-)