Probleme bei CSS

Nica

Nungut, ich habe bislang mit dem IE gearbeitet und bin nun auf Firefox umgestiegen. Für manche bekannte erarbeite ich die Websites und da habe ich folgendes Problem.

Die Seiten sollen auf beiden Browsern einigermaßen gut aussehen ohne das ich alles doppelt schreiben muss, gibt es da irgend eine besondere möglichkeit?

Vor allem stört mich ein Problem, ich habe Standartmäßig den Text align="center" das funktioniert auch einwandfrei, nur ab und an muss der Text linksbündig stehen, dazu habe ich einen neuen style angelegt in der CSS-Datei, dieser wird im IE auch umgesetzt also zum Beispiel align="left" bei firefox ist es trotz allem noch center.

was kann ich dagegen tun außer bei allen Textstellen einzelnd den style verändern?

Brady

Hi nica !

kann es daran leigen, dass bei CSS-Zuweisungen eine Priorität gilt ?

D.H. Anweisucbngen im TAG selbst ünerschreiben Anweisungen in der Strur und aus externen CSS-Dateien, Css-Anweisungen in der HTML-Struktur wiederum überschrteiben die Anweiungen der exteren Dateien, daraus folgt , exterene Style-Dateien werden nur korrekt ausgeführt wen weder im HTML noch in einem bestimmten TAG eine CSS-Anweisung steht .

Die reihenfolge ist somit :

1. Style-Definitionen im TAG
2. Style-Definitionen im HTML
3. Style-Definitionen im aus externen Style-Dateien.

Gruß

Brady

Nica

Also genauer, ich habe in einer externen CSS-Datei alle Styles gelagert, keinen Woanders.

Generell für Texte align="center" und dann einen extra style angelegt für bestimmte Texte (auch in dieser Datei) der für die bestimmten Stellen ist.

Dieser wird im IE auch angesehen, im Firefox nicht.

WEnn ich aber dann in der html Datei den Style direkt vor Ort anlege funktioniert es aber das ist doch umständlich!

Nica

ich möchte gerne alle styles in der CSS Datei haben das wenn ich einmal etwas ändern muss, nur die CSS ändere und alles andere geht automatisch durch diese Änderung.

Ist eigentlich doch auch logisch oder?

Funktioniert aber nicht

Hernals

In aller Kürze:
1. Hier findest Du eine gute Anleitung: http://www.css4you.de/
2. align="center" ist nicht CSS. Es heißt style="text-align:center"

Nica

das ist doch logisch, und das beispiel kann ich im moment nicht geben wiel auf meiner eigenen Page durch Jahrelanges üben alles möglich an Fehlern vorhanden ist...*gfg

Doch vor dem Problem stehe ich immer noch.

Wenn ich nun zum Beispiel einen Tag habe. mit der id="1".

id="1" ist in der CSS Datei wie folgt:

#1 {font-family:Verdana; font-size:8pt; text-align:center;}
Dann ist der Text zentriert wunderbar

habe ich nun einen Tag mit der id="2"

#2 {font-family:Verdana; font-size:8pt; text-align:left;}

ist merkwürdiger weise dieser auch zentriert!

aber nur bei firefox nicht beim IE (der IE zeigt es so an wie ich es haben möchte.

brain

Ich vermute es liegt an deinen ID's. Laut Standard müssen die nämlich afaik mit einem Buchstaben oder dem Unterstrich beginnen, nicht aber mit einer Zahl. Der IE ist da etwas (zu) tolerant. Dass deine Absätze zentriert sind liegt vermutlich daran, dass du entweder für alle p-Tags oder für ein übergeordnetes Element text-align:center korrekt festgelegt hast. Im letzteren Fall würde die Eigenschaft an das p vererbt werden (was auch korrekt ist). Deine zusätzlichen Anweisungen über die ID's werden einfach ignoriert.

Simon1983

Ganz genau, eine CSS ID darf niemals mit einer Zahl anfangen, sowas wird vom Firefox ignoriert da es laut Standard ein Fehler ist.

Der IE ist da mal wieder toleranter, der frisst allerdings auch verdammt viel Mist.

HaMF

Übrigens wird laut den Standards ein Absatz automatisch beendet (also der tag geschlossen) wenn ein neuer Absatz innerhalb von dem ersten erstellt wird (sprich: wenn innerhalb von dem ersten absatz irgendwo nen zweiter -Tag ist)

Kompliziert?
Beispiel:

HTML

<DOCTYPE>
<html><head><title>Bla</title>
<style>


#nr1
{
	/*Richtet den TEXT des ersten Absatzes zentriert aus.*/
	text-align:center;
	/*Nur damit man es auch sieht: ROT*/
	background-color:red;
}
#nr2
{
	/*Richtet den TEXT des zweiten Absatzes linksbuendig aus.*/
	text-align:left;
	background-color:yellow;
}
</style>


<body>
<p>
<p id="nr1">Der erste Absatz: BlablablablablablablablablablablablaBlablablablablablablablablablablabla<br>
BlablablablablablablablablablablablaBlablablablablablablablablablablabla<br>
BlablablablablablablablablablablablaBlablablablablablablablablablablabl<br>


<p><p id="nr2">Ein Absatz in nem Absatz Ein Absatz in nem Absatz immer noch ein Absatz in nem Absatz und so weiter und so fort und so weiter und so fort (hatte keine Lust auf ein Lorem Ipsum)</p></p>


Immer noch der erste Absatz BlablablablablablablablablablablablaBlablablablablablablablablablablabla<br>
BlablablablablablablablablablablablaBlablablablablablablablablablablabla<br>
BlablablablablablablablablablablablaBlablablablablablablablablablablabl<br>
</p></p>


</body>
</html>

Alles anzeigen

Ergibt sowas:
[Blockierte Grafik: http://img82.imageshack.us/img82/8059/bla0ry.th.png]

Was nach dem zweiten absatz steht ist NICHT mehr rot, weil es eben nicht mehr zu dem ersten Absatz gehört. Deshalb also auch nicht mehr zentriert. (Sieht man auf dem Bild nu schlecht. Musst dir deine eigene Beispieldatei machen.)

Gruß Hannes
PS: hab grad keinen webspace zum hochladen

Nica

das mit der zahl ist eigentlich auch klar,
hab halt ein dummes beispiel jetzt gegeben.

aber richtig weiter geholfen hat mir das jetzt auch nicht. Auch das mit den Absätzen ist nicht die Lösung meines Problems.

Wenn ich ein Paar Absätze linksbündig und alle anderen auf der Page zentriert haben möchte ist es schon etwas verzwickter.

irgendwie haut das nicht hin!

HaMF

weiteres vorgehen: sag genau was du willst und geb den Link zu ner Testseite an.

bejot

Zitat von Nica

Wenn ich ein Paar Absätze linksbündig und alle anderen auf der Page zentriert haben möchte ist es schon etwas verzwickter.
irgendwie haut das nicht hin!

Moin,
bei mehreren Absätzen mit gleicher Ausrichtung musst du mit Klassen arbeiten, da du gleiche IDs nicht mehrfach vergeben darfst!

so z. B.

Zitat

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test</title>

<style type="text/css">
body{ background-color:teal; }
p {text-align:center; color:#f4a460; }
p.links {text-align:left; color:#fff; }
</style>

</head>
<body>

Linker Absatz
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla


Absatz in der Mitte
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla


noch ein linker Absatz
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla


langer Absatz in der Mitte
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
la bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 
Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla Bla bla
 


und noch einer mittig
 
Bla bla Bla bla Bla bla Bla bla

</body>
</html>

Alles anzeigen

Nica

ich glaube das könnte mir schon weiterhelfen wenn nicht melde ich mich wieder...

lach als beispiel kann ich leider keine testseite geben da ich im moment sehr gestresst bin mit anderen sachen...

als beispiel wie man es nicht machen sollte kann ich nur die Styles aus meiner Page angeben... die sind innerhalb von 5 Jahren entstanden und da ich so viel erneuert habe und nie was gelöscht...

also lassen wir das lieber*gfg