[Jann Hendrik]

Ich habe ein Problem mit der richtigen Einstellung der CSS-Eigenschaften für div-Container.

Ich bin gerade dabei folgende Seite zu bearbeiten:
http://www.developement.bekaan.org/

Sie ist noch nicht fertig - daher braucht ihr hier auch noch keine Kritik abzulassen - das darf später geschehen!


Ich habe das Problem, dass der div #content gelegentlich zu breit wird und dann unterhalb von div #menu rutscht. Das sieht beschissen aus - will ich also nicht!
Das ist nur dann der Fall, wenn der Text innerhalb einer Zeile zu lang ist.

Gibt es dafür eine Eigenschaft, die ich zuviel habe, oder eine, die ich ergänzen müßte?


Wäre über Hilfe dankbar!


Danke.

[WarrenFaith]

Overflow hilft dir vielleicht weiter:
http://www.css4you.de/overflow.html

[Jann Hendrik]

ok - ich habe gerade mal ein wenig mit einem Helfer gechattet....


Dabei ist rausgekommen:
wenn man:
width=75% schreibt, dann mag das nur der IE....


*an den Kopf hau*


@Warrenfaith: danke!

[beny_mcde]

overflow alleine reicht glaube ich nicht aus.
das problem wenn man float benutzt ist halt, daß wenn nicht ausreichend platz da ist halt die elemente untereinander angeordnet werden.
unter umständen kann es auch sein das jemand mit einer kleinen auflösung das menu und den content niemals nebeneinander sieht, auch wenns bei dir klappt.
auch wenn man das fenster verkleinert springt der content nach unten.
dieser effekt ist bei funktionalen seiten ja ganz gut, aber wenn man ein festes design hat kann das alles zerstören...

du solltest den menu und den conten div nochmal in einen div stecken, der eine feste breite hat. somit kannst du den umbruch vermeiden.
falls wegen einer zu kleinen auflösung oder verkleinern des browserfensters zu wenig platz ist, werden dann am unteren und rechten rand vom browser scrollbars angezeigt.

ist bei mir jedesmal ein riesiges gefummel bis es im mozilla und internetexplorer aussieht, aber am ende kann man sich über das schöne ergebniss freuen.

// edit by Jann Hendrik: hier beginnt post #2:

währen ich schrieb kam schon das übliche problem bei dir auf....

am besten erstellt man einen seperaten stylesheet für den internetexplorer (microsoft kriegt die extrawurst...)
den man wie folgt einfügen kann...
ist besser als sich mit css hacks rumzuschlagen.

 <!--[if IE]>
     <style type="text/css">
      @import url("css/mainIE.css");
     </style>
 <![endif]-->

wie man an dem "<!-- ... -->" tags sehen kann ist das ein html kommentar, wird also von allen anderen browsern ignoriert.

irgendein schlauer microsoft programmierer hat das wohl eingeführt, weil er bemerkt hat wie sehr der ie die standarts missachtet


zu beachten ist nur das dieser code nach dem eigentlichen stylesheet eingebunden wurd, da man sonst keine werte übverschreiben kann.

[Jann Hendrik]

bei mir sieht es aber nun sowohl im IE als auch im FF nahezu identisch aus - jedenfalls ist die div-Anordnung korrekt. Sowohl bei 800x600, 1024x768 als auch bei größeren Auflösungen.

Daher die Frage an dich: welchen Browser hast du - welche Auflösung?

[beny_mcde]

ich hab firefox 1.5 und eine auflösung von 1280x1024.
das mit den auflösungen war nicht direkt auf deine seite bezogen,
es ist nur generell ein problem wenn man mit pixel angaben arbeitet.
da diese ja unter einer kleineren auflösung größer erscheinen.

es scheint ja jetzt bei dir zu gehen, was hast du verändert?

natürlich kann man es auch mit einem stylesheet im ie und firefox hinkriegen,
aber wie du ja schon sagtest nur nahezu gleich.
das liegt z.B. daran das die beiden browser die padding und margin angaben anders interpretieren.


wenn man das fenster ganz klein macht, rutscht der content bereich aber trotzdem noch nach unten. eben das kann mit dem umschließenden div vermeiden

[WarrenFaith]

er hatte einen schreibfehler bei der width-angabe ( = statt : ) der IE hat das geschluckt, der FF aber nicht.

[Jann Hendrik]

@beny_mcde: das hatte ich ja oben schon geschrieben...
also das mit dem =


Das war aber schon geändert, als du deinen Text geschrieben hattest!

[beny_mcde]

ups...