|
|||
Box in Box und width 100%
Hi, bin neu in der CSS Materie und stolpere ständig über Dinge, die von der Logik her so eigentlich nicht sein dürften. Aktuelles Beispiel:
Ich möchte in eine Box 1 eine weitere Box 2 setzen, wobei Box 1 automatisch seine Höhe anpasst, wenn Box 2 größer wird. css: #box1 { margin: 5px 0 0 0; padding: 20px 30px 20px 30px; height: 100%; background-color: #FFFFFF; text-align: left; } #box1 { float:right; padding: 30px; background-color:#DDCFBB; } html: <div id="box1"> <div id="box2"> haha<br />haha<br /><br /><br /> </div> </div> Das Ergebnis im FF, Box1 wächst nicht mit und Box2 verschiebt alles ff.JPG Und im IE alles richtig komischerweise ie.JPG Verstehs echt nich mehr, Hilfe! |
Sponsored Links |
|
||||
In deinem ersten Post hast du #box1 mit #box1 überschrieben.
Auf deiner Seite ist in #mitte die gefloatete #box1. #mitte wächst nur im IE<8 mit. Siehe css-faq2
__________________
MfG Jens |
|
|||
da hatte ich mich wohl verschrieben oben, sorry.
bedeutet das also ich muss dieser floating box explizite größenangaben verpassen? aus dem clearing werde ich auf die schnelle nicht schlau. |
|
|||
ok, so weit verstanden und danke erstmal!
habs geändert und nun reagiert zumindest meine fußzeile auf die höhe der "floating box", weil es ja das nachfolgende element ist (wie du schon beschrieben hast). leider ändert das noch nichts für die box, in der sich die floating box gefindet, denn diese passt ihre höhe nach wie vor nicht an. was kann man da machen? |
|
||||
Moin,
height:100% bleiben wirkungslos, weil der Vorfahre keine definierte Höhe hat. div#mitte schließen den Float erst ein, wenn entweder div#mitte auch floatet, oder z.B. direkt nach dem Ende von div#box1 gecleart wird. Das geht mit einer < hr class="clear" /> und entsprechender Formatierung. Du hast Float/clear leider noch nicht verstanden. Da solltest du dich belesen..
__________________
Ein mehrfacher Gruß aus dem Südosten Klaus |
|
|||
besten dank hubspe, so klappts!
es wäre ja grundsätzlich kein problem gewesen, wenn das die floating box nich in nem 100% div gehangen hätte. die idee mit der hr zum beispiel wäre mir nie gekommen. ich setze also die hr in weiß ans ende vom #mitte div und direkt nach dem div der box1. läuft perfekt. merkwürdig nur, dass man sich solcher tricks bedienen muss, oder is das normal? warum liest man nichts darüber, denn so speziell kann mein fall ja nu nich sein. |
|
|||
Zitat:
Es gibt viele Dinge in CSS, die man intuitiv nicht verstehen kann. Deshalb funktioniert auch "learning by doing" nicht. Man muss sich hinsetzen, lesen und lernen. Einen Link auf Little Boxes hast du ja schon bekommen. Wenn du damit durch bist, hast du dir die Grundlagen erarbeitet. Zitat:
Übrigens: Was du oben für die "richtige" Darstellung im IE (< 8 ) gehalten hast, ist ein Bug. Das Sonderverhalten des IE ist hasLayout geschuldet, ausgelöst durch die ansonsten wirkungslose height-Angabe.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken Geändert von fricca (03.11.2010 um 09:57 Uhr) Grund: Blöde Auto-Smilies. |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit einem 3D-Effekt | moep0710 | CSS | 12 | 12.06.2010 15:30 |
prblemme mit mein inhalt div | carlos587261 | CSS | 3 | 23.04.2008 15:07 |
Mozilla zeigt DIV zu oft an | cracki | CSS | 6 | 09.03.2008 16:22 |
#boxes a:hover.info: 2.posting mit css !!! | marioN | CSS | 5 | 25.01.2004 18:04 |
#box a:hover .info: css-layout: ie6.0/win, moz.1ie5.0/mac, | marioN | CSS | 2 | 19.01.2004 18:17 |