✔ Erscheinen des Scrollbalken verändert im fox aussehen

[Merbi]

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


MFG Daniel

P.S. Freue mich auf CSS3

 

[Merbi]

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

 

[Maik]

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:

/* --- 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.

 

[Merbi]

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

 

[Maik]

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

<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.

 

[Merbi]

So das funktioniert wenigstens

Und im IE läuft das mit dem Fenster verkleinern auch.

Nur der Fox macht noch kleine Probleme weil er hallt den header und den main Bereich noch ein wenig dünner macht und leider wenn der scrollbalken weg ist das Menü nicht genau passt.

Ebenfalls noch ne Frage ist es möglich das so zu programmieren das sich der main Bereich mit der Höhe nicht nur an content anpasst sondern auf der ersten Seite auch an die Länge von den news.

MFG Daniel

 

[Merbi]

Das mit dem Menüaussehen hat sich erldedigt.

Für alle Interessenten.

Habe das margin-right weg gemacht und stattdessen min und max-width auf die gleiche Breite.

Somit habe ich durhc ausprobieren die Breite an die des Menüs angepasst.

Im IE Läufts durch das normale width.




Jetzt wäre es nur Nett wenn einer ne Idee hätte wie ich es machen kann das die Länge des main-container sich an die Länge von news und content anpasst.

Weil die News sicher mal länger werden.



Ansonsten noch nen schönen Abend.

MFG Daniel

 

[Maik]

Da es sich bei der rechten Spalte um eine Float-Umgebung handelt, muss diese zum Abschluß auch "gecleart" werden, also wieder der normale Textfluss im Dokument hergestellt werden, damit das Elternelement #main in seiner volle Höhe angezeigt wird, und nicht von der Spalte am unteren Ende "überlappt" wird.

Siehe hierzu auch den Artikel http://positioniseverything.net/easyclearing.html, in dem sich dieser CSS-Code findet:

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

Die Klasse .clearfix wird dann zusätzlich im DIV #main aufgerufen:

<div id="main" class="clearfix"> ... </div>

 

[Merbi]

Soooo Daaankeee.

Werde die Seite dann Morgen schonmal abgeben und mich nur noch ein wneig bei den Inhalten einschalten.

MFG und 100 Dank

Dieser Thread wird jetzt dann geschlossen.