CSS in Firefox und Explorer

[Bluevelvet64]

Hallo

folgende css class soll dafür sorgen das eine Webinhalt immer zentriert auf 1024 pixel im Browser dargestellt wird.
In Firefox geht es in Explorer ist der Webcontent links

Kann es sein das der Explorer kein Auto für Margin kennt. ???

.main
{
position:relative;
background-color: #ffffff;
width:1024px;
height:98%;
margin: 0px auto;
}

 

[HLX]

Doch, kennt er.

Welchem Tag hast du den Style zugewiesen?

Versuchs mal ohne die 0px bei der Margin.

 

[Bluevelvet64]

ich habe die class einer DIV zugewiesen. Den Wert 0px habe ich erst reingenommen, weil ich dachte das es dann im Explorer geht. Voher hatte ich nur auto drin.

 

[ARadauer]

dem container in dem .main drin ist, setzt du ein
text-align: center

 

[Bluevelvet64]

Ist schon drin, den sonst würde auch Firefox linksbündig anzeigen

 

[ARadauer]

height:98%;

das wirds laut standard nicht spielen... das bekommst du nie richtig hin.

les dir mal das genau durch

http://de.selfhtml.org/css/layouts/mehrspaltige.htm

 

[Bluevelvet64]

Warum sollte das nicht gehen. Damit lege ich fest das nicht die volle Höhe genutzt werden soll. Das setzt auch der Explorer so um.

 

[ARadauer]

mit welchem browser testest du?

poste mal mehr von deiner seite.

wein dein main nirgends drinn ist, musst du dem body das text-align: center setzen.

margin: 0px auto; wird in ff zentriert, da brauchst kein center

 

[ARadauer]

Warum sollte das nicht gehen. Damit lege ich fest das nicht die volle Höhe genutzt werden soll. Das setzt auch der Explorer so um.

weil das nicht standard ist, nur weil es ie 5.5 oder 6 richtig machen, heißt das noch lange nicht, das es ie 7 und ff machen. die tuns nähmlich nicht

sorry is so, der css standard des w3c is einfach ein schmarrn...

 

[ARadauer]

ich muss jetzt weg,
poste mal deine gesamte seite, ich schau gegen 22:00 nochmal rein.


http://de.selfhtml.org/css/layouts/mehrspaltige.htm genau lesen das hilft.
layouts mit css zu bauen ist sehr schwierig... das war mit tabellen einfacher. aber is halt nicht... ähm ja das was der w3c will

 

[HLX]

Setz mal für das body-Tag die CSS-Eigenschaft text-align: center

 

[Bluevelvet64]

Hier definiere ich die class main

.main
{
position:relative;
background-color: #ffffff;
width:1024px;
height:98%;
margin: 0px auto;
}


Hier definiere ich die class oben

.oben
{
position: relative;
top: 5px;
left: 0px;
margin:0px;
width: 100%;
background-color: #ffffff;
height:65px;
}


Hier verwende ich die class main

<DIV class="main">

<div class="oben">
<f:subview id="oben">
<jsp:include page="pages/oben.jsp"/>
</f:subview>
</div>
</DIV>

Meine Browser sind Firefox und Opera in Windows und Linux und Explorer in Windows.

In allen Browsern geht es, nur nicht im Explorer

 

[HLX]

Die prozentualen Höhenangaben mit Pixelangaben zu mischen (98% bzw. 65px) ist prinzipiell keine gute Idee. Das solltest du vereinheitlichen. Hast du das body-Tag formattiert (s.o.)? Der IE hat nämlich die nette Eigenschaft, über "text-align" auch die Container auszurichten statt nur den Text.

 

[AlArenal]

sorry is so, der css standard des w3c is einfach ein schmarrn...

Nein, die Art & Weise wie diverse Rendering Engines diese Standards NICHT korrekt umsetzen führt in der Darstellung zu Schmarrn. Würde man sich an die Standards halten, wäre alles okay, selbst wenn man Teile davon nicht implementieren würde. Was der Renderer aus Redmond aber gerne tat und tut ist abweichend vom Standard zu operieren.

 

[ARadauer]

sorry gestern ist sichs nicht mehr ausgegagen.

genau, dein body braucht ein text-align: center;

 

[Bluevelvet64]

geht nicht.

Ich verwende folgende div

main für alle Inhalte : dieser bekommt den wert margin: auto;

kopf nimmt den Kopf auf liegt in main
menu nimmt das Menu auf liegt in main

Wenn ich den wert text-align setze passiert folgendes.

Unter Firefox und Konqueror in Linux und Windows hat der Wert keinen Einfluss wenn ich diesen im Body oder im main setze.

Wenn ich in main den wert text-align: center setze passiert folgendes.

Im Explorer 7 :

div main wird nicht zentriert
div kopf wird nicht zentriert
div menu wird zentriert.

In allen anderen Browsern wird div main zentriert und die beiden innenliegenden divs menu und kopf liegen in main


Wenn ich in main den wert text-align: center nicht setze passiert folgendes.

Im Explorer 7 :

div main wird nicht zentriert
div kopf wird nicht zentriert
div menu wird nicht zentriert.

In allen anderen Browsern wird div main zentriert und die beiden innenliegenden divs menu und kopf liegen in main

 

[HLX]

text-align:center wirkt sich bei den standardisierten Browsern nur auf den Text aus und nicht auf die divs...

Ohne weiteren Code ist es schwierig zu sagen wo das Problem liegt. Manchmal liegt das Problem im Detail (z.B. Tippfehler oder weitere Style-Zuweisungen).

Die Regel ist: um das allesumschließende DIV zu zentrieren: Margins auf Auto setzen und für den Internet Explorer dem Body-Tag ein text-align:center spendieren. Möglichst alle DIV-Styles mit position: relative, damit sich das auch auf die innenliegenden Elemente auswirkt. Ein weiteres text-align:center hier nur dann, wenn innerhalb des entsprechenden DIVs auch nochmal zentriert werden soll.

Teste das ganze auch mal mit einer festen Maßeinheit, also entweder Prozent oder Pixel. Das kann manchmal Wunder bewirken.