[HaBo]

Milbex · 13.10.10, 23:35

Hi Leute,
ich habe ein ziemlich doofes Problem. Und zwar, dass ich eine Seite habe, bei der ich den XHTML 1.0 Transitional Doctype verwende. Nun ist mein Prob, dass ich eine externe CSS-Datei einbinden will. Ich kann mit meinem Doctype Farben, aber nichts anderes (font-size, font-family, position:relative/absolute etc.) darstellen. Wenn ich allerdings den Doctype wegnehme, stellt mein Mozilla Firefox die Seite richtig dar.
Ich habe auch schon andere Doxtypes versucht, ist aber immer das selbe, wie mit dem XHTML Transitional.

Hier meine index.html:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>CSS --- Doctype</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" type="text/css" href="style.css">
  </head>
  <body>
    
    <p>Hier der Text wird formatiert...</p>
    <div>Dieser Text wird anders formatiert als der Andere...</div>
    
  </body>
</html>

und mein externes Stylesheet style.css:

Code:

p    {color:green;
    position:absolute; left:100; top:100
}

div    {color:blue
    font-size:22;
}

Ich habe es auf das Wichtigste begrenzt.
Würde mich über schnelle Antworten freuen.

mfG Milbex

metax. · 14.10.10, 00:11

Schlichte Antwort: Dein CSS ist kaputt.

Wenn du keinen Doctype (oder einen alten) angibst, geht der Browser in den Quirks-Modus und rendert kaputtes HTML und CSS.
Wenn du einen korrekten XHTML-Doctype verwendest ist der Browser in Standards-Compliance-Modus und ignoriert kaputte oder ungültige HTML/CSS-Kontruktionen.
Also musst du nur korrektes CSS schreiben, dann geht's auch im XHTML-Doctype.

Was genau ist bei dir kaputt?
1. nach "color:blue" ist kein Semikolon. Damit verschmilzt die Regel mit der nächsten Zeile
2. Größenangaben und Abstände müssen immer mit Einheit angegeben werden (außer der Wert 0). Also normalerweise "px" (für Pixel)

Insgesamt muss dein CSS also lauten:

Code:

p    {
    color: green;
    position: absolute;
    left: 100px;
    top: 100px;
}

div    {
    color: blue;
    font-size: 22px;
}

mfg, metax.

Anzeige

- Anzeige -

Moe · 14.10.10, 10:55

Alles, was vorher schon gesagt wurde .. und darüber hinaus ist "<link>" ein in sich geschlossenes Element. Das heißt, dir fehlt ein Slash am Ende:

HTML-Code:

<link rel="stylesheet" type="text/css" href="style.css" />

Tipp: Es gibt sowohl für (X)HTML als auch für CSS vom World Wide Web Consortium sog. "Validators", welche den entsprechenden Code auf Richtigkeit überprüfen und ggf. Fehler und Warnungen ausgeben, falls dein Code nicht richtig oder standardkonform ist und meistens sogar Verbesserungen anregen.

Milbex · 14.10.10, 13:33

vielen dank ihr beiden.
ohne euch wäre ich noch verzweifelt.

mfG Milbex

Anzeige

- Anzeige -

13.10.10, 23:35	#1 (permalink)
Milbex Registriert seit: 05.05.10 Likes: 0	Doctype und CSS Anzeige Hi Leute, ich habe ein ziemlich doofes Problem. Und zwar, dass ich eine Seite habe, bei der ich den XHTML 1.0 Transitional Doctype verwende. Nun ist mein Prob, dass ich eine externe CSS-Datei einbinden will. Ich kann mit meinem Doctype Farben, aber nichts anderes (font-size, font-family, position:relative/absolute etc.) darstellen. Wenn ich allerdings den Doctype wegnehme, stellt mein Mozilla Firefox die Seite richtig dar. Ich habe auch schon andere Doxtypes versucht, ist aber immer das selbe, wie mit dem XHTML Transitional. Hier meine index.html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>CSS --- Doctype</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <p>Hier der Text wird formatiert...</p> <div>Dieser Text wird anders formatiert als der Andere...</div> </body> </html> und mein externes Stylesheet style.css: Code: p {color:green; position:absolute; left:100; top:100 } div {color:blue font-size:22; } Ich habe es auf das Wichtigste begrenzt. Würde mich über schnelle Antworten freuen. mfG Milbex __________________ I love Windows... ...I used it to download Linux

14.10.10, 00:11	#2 (permalink)
metax. Registriert seit: 22.01.07 Likes: 10	Schlichte Antwort: Dein CSS ist kaputt. Wenn du keinen Doctype (oder einen alten) angibst, geht der Browser in den Quirks-Modus und rendert kaputtes HTML und CSS. Wenn du einen korrekten XHTML-Doctype verwendest ist der Browser in Standards-Compliance-Modus und ignoriert kaputte oder ungültige HTML/CSS-Kontruktionen. Also musst du nur korrektes CSS schreiben, dann geht's auch im XHTML-Doctype. Was genau ist bei dir kaputt? 1. nach "color:blue" ist kein Semikolon. Damit verschmilzt die Regel mit der nächsten Zeile 2. Größenangaben und Abstände müssen immer mit Einheit angegeben werden (außer der Wert 0). Also normalerweise "px" (für Pixel) Insgesamt muss dein CSS also lauten: Code: p { color: green; position: absolute; left: 100px; top: 100px; } div { color: blue; font-size: 22px; } mfg, metax. __________________ Wenn keiner zuschaut, teile ich heimlich durch Null! Meine Homepage: Planet Metax \| meine Bilder: DeviantArt \| Twitter

14.10.10, 10:55	#3 (permalink)
Moe root@yourmom ~ $ Registriert seit: 05.10.01 Likes: 2	Alles, was vorher schon gesagt wurde .. und darüber hinaus ist "<link>" ein in sich geschlossenes Element. Das heißt, dir fehlt ein Slash am Ende: HTML-Code: <link rel="stylesheet" type="text/css" href="style.css" /> Tipp: Es gibt sowohl für (X)HTML als auch für CSS vom World Wide Web Consortium sog. "Validators", welche den entsprechenden Code auf Richtigkeit überprüfen und ggf. Fehler und Warnungen ausgeben, falls dein Code nicht richtig oder standardkonform ist und meistens sogar Verbesserungen anregen. __________________ In personal conversations with technical people, I call myself a hacker. But when I'm talking to journalists I just say "programmer" or something like that. Linus Torvalds Lunar Linux Xfce

14.10.10, 13:33	#4 (permalink)
Milbex Themenstarter Registriert seit: 05.05.10 Likes: 0	danke vielen dank ihr beiden. ohne euch wäre ich noch verzweifelt. mfG Milbex __________________ I love Windows... ...I used it to download Linux

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

[HaBo]

Doctype und CSS