float nicht aufgehoben, wenn in Blockelement?
Jean Pascal
- css
0 Cheatah0 Der Martin0 Cheatah
0 Jean Pascal0 Cheatah
Hallo,
mich würde mal interessieren: Wenn ich ein floatendes Element einschließe in ein Blockelement, sollte dann nicht eigentlich nach dem Blockelement ein Umbruch entstehen, oder ist das anders definiert?
Bei mir floatet ein auf das Blockelement folgendes DIV trotzdem noch, d.h. ich muss es mit clear versehen.
Danke, Jean
Hi,
mich würde mal interessieren: Wenn ich ein floatendes Element einschließe in ein Blockelement, sollte dann nicht eigentlich nach dem Blockelement ein Umbruch entstehen,
nach dem Blockelement, in dem das gefloatete Element (bei welchem es sich übrigens ebenfalls um ein Blockelement handelt) ist, _ist_ ein Umbruch. Das gefloatete Element ragt u.U. heraus.
Bei mir floatet ein auf das Blockelement folgendes DIV trotzdem noch, d.h. ich muss es mit clear versehen.
Nein, das gefloatete Element floatet. Jedweder Text wird drum herum fließen; für das Box-Model selbst glänzt das gefloatete Element durch Nichtexistenz.
Cheatah
Hi Cheatah,
long time no hear!
Back from Hel^Wholiday? ;-)
So long,
Martin
Hi,
long time no hear!
ach was, gerade mal 'ne gute Woche. Wie viel ist das in Internet-Jahren? ;-)
Back from Hel^Wholiday? ;-)
Nope, ich nutze nur gerade 'ne Gelegenheit. In ein paar Tagen bin ich wieder Vollzeit dabei.
Cheatah
Hallo Cheatah,
danke für deine Antwort.
Entweder ich verstehe noch nicht, was du mir erklären willst, oder wir haben aneinander vorbei geredet. Ich habe hier mal zum besseren Verständnis einen Quelltext. Meine Frage: Eigentlich sollte doch - wie du geschrieben hast - div.menue einen Umbruch erzeugen (da Blockelement), so dass p unter dem Menü beginnt, richtig? Derzeit floatet es aber neben dem Menü. Außer wenn ich clear in das p einfüge.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"><html>
<html>
<head>
<style type="text/css">
a.menue {
width: 5em;
height: 5em;
display: block;
float: left;
border: 3px solid #000000;
}
div.menue {
width:55em;
}
p.content {
background-color: #EEEEEE;
}
</style>
</head>
<body>
<div class="menue">
<a href="test1.htm" class="menue">Test</a>
<a href="test2.htm" class="menue">Test</a>
</div>
<p class="content">Lorem ipsum dolor sit amet.</p>
</body>
</html>
Gruß Jean
Hi,
Entweder ich verstehe noch nicht, was du mir erklären willst, oder wir haben aneinander vorbei geredet. Ich habe hier mal zum besseren Verständnis einen Quelltext. Meine Frage: Eigentlich sollte doch - wie du geschrieben hast - div.menue einen Umbruch erzeugen (da Blockelement), so dass p unter dem Menü beginnt, richtig?
das <p> beginnt unter dem <div class="menue"> (welches übrigens ein <ul> sein sollte). Die Links in diesem <div> ragen aber aus ihm heraus, so dass die Inhalte(!) des <p> darum herum fließen. Nutze die Macht des border.
a.menue {
Wozu haben die Links eigentlich eine Klasse? Gibt es innerhalb des <div class="menue"> noch Links, die nicht zum Menü gehören?
display: block;
float: left;
Für den IE solltest Du in dieser Konstellation display auf inline setzen. Das hat exakt die selbe Wirkung, umgeht aber einen der vielen IE-Bugs.
Cheatah
Aaaaaaah, jetzt!
Danke, für diese Erleuchtung. Ich war die ganze Zeit davon ausgegangen die Höhe des DIV richte sich nach dem Inhalt, sprich den fest definierten <a>s. Das Div ist ja auch um die <a>s herum. Warum ist das dann eigentlich nicht so?
Mit der Klasse hast du Recht, die ist unnötig. <ul> werd ich einbauen.
Danke auch für den Tipp mit inline. Ich dachte es müsste block sein, damit nicht width und height ignoriert werden und habe übersehen, dass die <a>s durch das float ja ohnehin blocks werden. Verwunderlich finde ich allerdings, dass man mit der inline-Definition dann nicht den Block-Status aufhebt.
Jean