Frage zu "float" - mal wieder

glowy · 27.06.2006, 18:40

Hallo,

ich mal wieder mit einer CSS-Frage, wird sich vielleicht der eine oder andere denken.

Ich bin gerade dabei eine Website für die SV meiner Schule zu machen und komme gerade nicht weiter. Mal wieder sind die floats Schuld.

Hier gibts mal ein "Bild", wie's aussehn soll: là.
Hier die CSS-Datei: hier und hier die Index-Datei, wie es im Moment aussieht.
Ich möchte die Navi links und den Text rechts haben, der Text aber gerade nicht unter die Navi, sondern einfach nach unten, parallel zur Navi. Aber wenn ich der Navi "float: left" zuweise, dann rutscht sie unter dem Trennstrich oben (grau) runter und ich weiß nicht, wie ich jetzt mit dem rechten Bereich herumhantieren soll.

Kann mir jemand sagen, wo mein Problem liegt?

Viele Grüße von PythOn_tp

hero-master · 27.06.2006, 19:52

Hi Python,

Zitat:

Zitat von PythOn_tp

Kann mir jemand sagen, wo mein Problem liegt?

Das Problem könnte daran liegen, dass du ein wenig faul zu sein scheinst

Float - Die Theorie. Lies dir das mal durch, dann bist du in der Hinsicht um einiges schlauer.
Es wurde doch schon so viel in deinem anderen Thread darüber diskutiert:
Du weißt der Navi ein float:left zu. Das bedeutet, dass dieses Element aus dem Fluss genommen wird und alles darum fließt.
Du hast jedoch nichts für den content definiert. Am einfachsten ist es, wenn du dem content ein float:left und eine Breite zuweist.
Eine weitere Möglickeit wäre es dem content einen Außen- oder Innenabstand zu verpassen, je nach belieben.

glowy · 27.06.2006, 20:54

Den Text hatte ich schon gelesen, aber so richtig einleuchtend finde ich ihn ehrlich gesagt nicht.

Daniel FR · 28.06.2006, 08:43

Hatten wir doch schon, das Thema.

glowy · 28.06.2006, 15:55

Joa, nur da bissel anders, z. B. mit dem Runterrutschen der Navi. Finds auch blöd, als ich das gelesen habe im Buch, wurde float nur auf einer Seite behandelt, da war ich noch optimistisch.

Daniel FR · 28.06.2006, 16:02

Versuch mal, das an dein CSS anzufügen:

Code:

#content
{
margin:0 0 0 180px;
padding:5px;
}

glowy · 28.06.2006, 16:11

passiert nicht viel.

habe es hochgeladen unter http://lab.pytalhost.com/sv-mco

28.06.2006, 16:33

wenn du floatest, d.h. wenn du objekte aus dem natürlichen textfluss nimmst, musst du auch "clearen", um den textfluss wieder herzustellen.
die seite, die nico dir verllinkt hat, kaut all dies durch und bietet dir das theoretische hintergundwissen um praktisch mit floats zu arbeiten.

für die von dir erstellte seite würde dies bedeuten, dass du ein clearendes element nach dem content setzt, z.b. ein

Code:

<br style="clear: left;" />

bevor du dein div #container schliesst.

und mal nebenbei erwähnt:

dein body ist nicht richtig geschlossen. richtig ist </body> statt <body>
die schrift ist bei mir in allen browsern unlesbar klein, was u.u. von 1. verursacht sein könnt

glowy · 28.06.2006, 16:52

Häh?

Im Firefox ist alles wunderbar zu lesen, was meinst du mit 1.?
Und das body-Tag ist auch korrekt?! Ich hab keinerlei Fehler entdeckt, kann es sein, dass du aus Versehen den Schriftgrad runtergedreht hast?

28.06.2006, 16:53

Zitat:

Zitat von PythOn_tp

Häh?

Im Firefox ist alles wunderbar zu lesen, was meinst du mit 1.?
Und das body-Tag ist auch korrekt?!

Code:

<script src="http://layer-ads.de/la-11423-subid:pho24290.js" type="text/javascript"></script>
<body>
</html>

alle browser auf dem mac zeigen die mini-schrift. runtergedreht is nichts.

glowy · 28.06.2006, 16:56

Stimmt, jetzt sehe ich es auch, obwohl ich was anderes im Quelltext habe und dieses dumm <script>-Element kommt auch nicht von mir, sondern vom Hoster.

Das mit der Schrift ist allerdings komisch.

Daniel FR · 28.06.2006, 17:12

Füg der #navi einen margin-right:10px hinzu.

Außerdem würde ich dir sehr empfehlen, nicht mit absoluten Maßangaben zu arbeiten, sonst zerschießt es je nach Schrifteinstellung im Browser dein ganzes Layout.

Mit

Code:

* {border:solid 1px blue;}

o. ä. kannst du deine Elemente sichtbar machen. das macht das Rumprobieren vielleicht etwas effektiver.

Gruß, Daniel