Hallo allerseits,

ich aheb jetzt die Menübreite der Homepage
An die breite des header und des Inhaltbereichs angepasst.

Wenn ich jetzt aber im Firefox auf eine Seite komme die so lang ist das man einen Scrollbalken braucht und dieser dann erscheint wird der header-bereich und der mainbereich dünner der menü Bereich aber nicht.

Somit ist das nicht mehr gleichlang sondern steht über.

Vlt. kennt einer ne Lösung mit der man das umgehen kann.

MFG Daniel


Ergänzung: Habe egrade gemerkt dasw enn man z.B. das Fenster bei Beiden kleiner macht, das sich dann alle container verschieben.

Habe kein Plan woran das liegt.

Hi,

gegenüber #header und #main fehlt #menue der rechte Außenabstand margin-right:48px - schön zu erkennen, wenn man dem transparenten Hintergrund einen Farbanstrich verpasst.

Dass sich beim Verkleinern des Fensters die Container vollständig zusammenstauchen lassen, und die Menüpunkte nacheinander in die nächste Zeile umbrechen, liegt einfach daran, dass die drei Boxen (#header, #menue, #main) keine feste Breite bzw. keine Mindestbreite besitzen.

Und auf der Seite "Angebote der Woche" hast du wiederum einen iFrame mit fester Breite eingebettet, weshalb dieser dann über den rechten Rand vom DIV #main hinaussteht, wenn der Anzeigebereich die iFrame-Breite unterschreitet.

Vielen Dank das du mir zum 100.000 mal weiterhilfst

Super erklärt auch sehr einleuchtend nur wieder Peinlich für mich das ich nicht selber drauf gekommen bin.

Dann amche ich min-width bei den containern und den Außenabstand beim Menü dann müsste es ja gehen.


MFG Daniel

Bei der min-width-Eigenschaft ist aber zu berücksichtigen, dass sie von den Vorgängerversionen des IE7 nicht untersützt wird.

Stu Nicholls hat da aber mit http://www.cssplay.co.uk/boxes/minwidth.html einen Lösungsansatz parat.

hmm wenn ich mal gut Englisch sprechen könnte.

Naja das mit dem margin-right hat gut geklappt.

Nur wenn ich im Firefox width auf 100% setze dann nimmt er den außenabstand nicht mehr an .

MFG Daniel

Das mit der width:100%-Angabe hatten wir doch gestern schon.

Lass sie weg, und alles wird gut.

Ja soweit ist es gut nur das hallt auf all meinem Homepages das problem besteht, das wenn man das Fenster verkleinert sich das gesamte Layout verändert gibts da nicht einen Befehl der dann Scrollbalken macht.


Wenn ich das bei dem Link von dir richitg verstanden habe muss ich noch einen Container machen der die Gesamte Homepage umfasst mit einem Außenabstand und die gesamten inneren Container mache ich dann mit 100%.



MFG Daniel

Zitat von KingOfRap

Ja soweit ist es gut nur das hallt auf all meinem Homepages das problem besteht, das wenn man das Fenster verkleinert sich das gesamte Layout verändert gibts da nicht einen Befehl der dann Scrollbalken macht.

Solange die Elemente keine feste Breite oder zumindest eine Mindestbreite besitzen, wird vom Browser auch kein horizontaler Scrollbalken angeboten.

Nur welche min-width Angabe muss ich verwenden ich kann ja schlecht tausende px zahlen ausprobieren bis es genau passt mit dem außenabstand.

MFG Daniel

Den genauen Wert kann ich dir nicht sagen, und ich werde es jetzt auch sicherlich nicht für dich in die Hand nehmen.

Du musst einfach mal testen, mit welchem Wert du da das beste Resultat erzielst, wenn das Browserfenster in der Horizontalen verkleinert wird.

Ein Anhaltspunkt könnte beispielsweise der erwähnte iFrame sein.

hmmm Ohh mann hätte nie gedacht das Programmieren soviel "ausprobieren" ist von den Werten her.


MFG Daniel

P.S. Freue mich auf CSS3

Soo im Fox läufts fast problemlos.

Nur wenn man das Fenster kleiner macht springt der letzte Menüpunkt ne "Zeile" runter.

Der Rest lässt sich via Scrollbalken ansehen.

Im Internetexplorer läuft im moment garnichts mehr wie ich will.

Blicke gerade nicht mehr durch muss jetzt aber kurz weg.



Hoffe da kann mir jemand nochmal helfen.


Ich weiß das ich oft hifle brauche.

MFG Daniel

Erhöhe mal den min-width-Wert auf 945px, dann bricht auch nicht der letzte Menüpunkt in die nächste Zeile um.

Hab jetzt nur mal kurz einen Blick in das IE-spezifische Stylesheet geworfen, und möchte dich darüber informieren, dass in diesem Stylesheet nicht der vollständige CSS-Code der stylesheet.css wiederholt wird, sondern nur die Selektoren und Eigenschaften aufgenommen werden, die für den IE korrigiert werden sollen.

Er lädt zuerst die stylesheet.css in das Dokument und im Anschluß die stylesheet_ie.css, um zuvor gesetzte Eigenschaftswerte in der stylesheet.css zu überschreiben, oder neue IE-spezifische CSS-Regeln mit aufzunehmen.

Der Code für die stylesheet_ie.css würde demnach bislang folgendermaßen lauten:

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

/* --- Navigation --- */   #menue {         width: 930px;         margin-left: 20px; }   /* --- content stuff --- */   #main {         margin-left: 20px; }   #header {         margin-left: 20px;         width: 870px; }   #news {         margin-top: 20px; }   #content {         margin-top: 20px; }

Der übrige CSS-Code ist deckungsgleich mit dem in der stylesheet.css.

Anmerkung: Wenn du diese Datei in einem Jahr mal wieder öffnest, siehst du sofort, was für den IE umgestellt, angepasst, erweitert wurde.

Dass deine Seite derzeit im IE (<7) nicht funktioniert, liegt zum einen an den festen Breitenangaben für die Boxen, und zum anderen an der fehlenden empfohlenen min-width-Lösung von Stu Nicholls.

Danke für den Tipp mit dem stylesheet_ie aber jetzt macht der das nicht und ich musste alles wieder komplett schreiben.
Also lass ich es lieber dann so.

Aber das mit dem min-height für IE auf der einen Seite habe ich glaube ich falsch verstanden weil es nicht funktioniert.

Ebenso nervt mich mittlerweile auch der Fox weil der den Scrollbalken nicht wie der IE von anfang an hat.

Manchmal klappt aber auch nichts.

MFG Daniel

Ruf die Stylesheets mal mit dem link-Element im Dokument auf:

Code :

1 2 3 4

<link rel="stylesheet" type="text/css" href="template/stylesheet.css" media="all"> <!--[if lt IE 7]> <link rel="stylesheet" type="text/css" href="template/stylesheet_ie6.css" media="all"> <![endif]-->

und nimm anstelle von [if IE] eine Fallunterscheidung bei den IE-Versionen vor - hier mit dem Operator lt für "kleiner als IE 7" - denn die aktuelle IE-Version unterstützt nun u.a. auch diese CSS-Eigenschaft, und wird daher den min-width-Hack nicht benötigen.