# CSS in Firefox und Explorer



## Bluevelvet64 (29. Mai 2008)

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 (29. Mai 2008)

Doch, kennt er.

Welchem Tag hast du den Style zugewiesen?

Versuchs mal ohne die 0px bei der Margin.


----------



## Bluevelvet64 (29. Mai 2008)

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 (29. Mai 2008)

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


----------



## Bluevelvet64 (29. Mai 2008)

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


----------



## ARadauer (29. Mai 2008)

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 (29. Mai 2008)

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 (29. Mai 2008)

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 (29. Mai 2008)

> 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 (29. Mai 2008)

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 (29. Mai 2008)

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


----------



## Bluevelvet64 (29. Mai 2008)

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 (29. Mai 2008)

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 (29. Mai 2008)

ARadauer hat gesagt.:
			
		

> 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 (30. Mai 2008)

sorry gestern ist sichs nicht mehr ausgegagen.

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


----------



## Bluevelvet64 (30. Mai 2008)

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 (30. Mai 2008)

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.


----------

