CSS-Problem in FF mit clear:both

[thoms]

Nachdem ich für Tabellen-Problem im voherigen Thread eine Lösung gefunden habe,bin ich mit der Listen-Darstellung nicht weitergekommen. Nachdem es ein neues Problem ist, habe ich mal einen neuen Thread aufgemacht, hier nochmal die Beschreibung:

Jetzt habe ich versucht, das dreispaltige Layout ganze mittels Listen (ul) zu lösen, was mir prinzipiell besser gefallen würde:
http://jammerbank.de/invadosomes/cmsmad ... ard---list

/* board list */

div#board_list {
  width: 100%;
}

div#board_list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

div#board_list ul li {
  float: left;
  width: 33%;
  margin: 0;
  padding: 0;
}

Allerdings muss ich dazu nach den Listen das float wieder abstellen, sobald ich allerdings ein clear:both einfüge, rutscht leider alles unter den News-Block, da das clear offensichtlich für alle divs gilt und nicht nur innerhalb des aktuellen Bereiches (ist das so?)

Wie ich jetzt gesehen habe, macht das nur der FF, im IE 6.0 ist die Darstellung korrekt.

Irgendwelche Ideen, woran das liegen könnte?

Gruß
Thomas

[Dr.CSS]

I would take this and wrap it in a div and set it to clear:both and take the clear:both out of the .nofloat...



^ Top

       
            Previous page: Statutes


            Next page: Board - table
       


As done here, you can see the border around it and the CSS is...

div#flat{clear:both;width:66%;height:38px;margin:10px 0;padding:5px}

[thoms]

Thanks for yout hint.

That may solve the current problem, but I plan to do further lists and would like to know generally, if I can use "floats" and "clears" within the content/main-parts without destroying the whole layout!

Does a "clear" quit ALL "floats" before? I thought that would only apply for the flaots in the current block/div.

[Dr.CSS]

When you applied clear:both it was clearing the left news block also, unless you wrap it and give it a width you may continue to have problems...

[thoms]

When you applied clear:both it was clearing the left news block also, unless you wrap it and give it a width you may continue to have problems...

Thanks again, can you give me a little bit more detail?
What do you mean by "wrapping"? Isn't it wrapped by a div? One more?
Second, giving it a width (like 20em) would solve the problem, so that the clear in the main-block wouldn't clear the news block? How that?

Happy new year, by the way

Thomas

[thoms]

Hi Otico,

vielleicht stehe ich ja gerade auf der Leitung:

Es ging mir im konkreten Fall um ein dreispaltiges Layout innerhalb des -DIVS.
Dazu müßte ich innerhalb des main-DIVS mit clear:left arbeiten, was mir aber dann außerhalb z.B. meinen News-Block (ich verwende das Layout simple navi vertical) verrutscht.

Beide Bereiche sind also eigentlich von DIVs umgeben, deshalb ist mir nicht klar, wo ich jetzt noch einen wrapper rumlegen soll.

Ich habe inzwischen nach Infos dzau gesucht und das jetzt so verstanden, dass ein DIV alleine nicht ausreicht, sondern man einen "block formatting context" (BFC) definieren muss, wo dann das clear nicht über die Grenzen hinweg wirkt:

http://www.w3.org/TR/CSS21/visuren.html ... formatting

Nachdem die Definitioneines BFC aber (bei jeder Methode) einige unangenehme Nebenwirkungen hat, habe ich davon Abstand genommen. Aber wie gesagt, vielleicht denke ich ja zu kompliziert oder hab's immer noch nicht kapiert...

Gruß
Thomas