ich bin's nochmal. Nachdem ihr mir schon letztens gut aushelfen konntet, komme ich mit meinem nächsten Problem zu euch
Mal vorweg, das Problemkind hört erneut auf den Namen IE9
Ich lerne gerade CSS mit dem tollen Buch Modernes Webdesing mit CSS von Heiko Stiegert aus der Galileo Design Reihe,
eigentlich 'ne tolle Sache, wenn man nicht zu Anfang so oft mit den Explorer Kompatiblitätsproblemen allein gelassen werden würde...
jetzt geht es um eine Gestaltung einer Überschrift mit einer Google API Font,
der Code ist bisher ganz überschaubar:
- Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" dir="ltr">
<head>
<link href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz&subset=latin" type="text/css" rel="stylesheet"/>
<style type="text/css">
h1
{
font: 35px "Yanone Kaffeesatz", Arial;
color: rgb(240,240,240);
background-color:rgb(34,32,34);
position:absolute;
left:20%;
top:0;
width:200px;
padding:25px 15px 15px 15px;
margin:0;
border-radius: 0 0 20px 20px;
}
h1 span
{
display:block;
font-size:20px;
padding-top:100px;
border-top:1px dashed #f0f0f0;
}
</style>
</head>
<body>
<h1><span>Be inspired by our</span> Webdesign</h1>
</body>
</html>
Ergebnis ist auch ganz nett, nur eine Sache verstehe ich nicht. Ich weiß ja nun, dass der IE auf einen DOCTYPE besteht, sofern man die "runden Ecken" angezeigt bekommen möchte (die anderen schaffens auch ohne, aber nunja).
Sobald ich aber dann einen DOCTYPE angebe, funktioniert die Google API Font Geschichte nicht mehr.
Also, ohne DOCTYPE: border-radius nein, Google Font ja,
mit DOCTYPE: border-radius ja, Google Font nein.
...natürlich nur den IE betreffen, die anderen rallens auch so.
Meine Frage ist kurz und bündig: Wieso ist das nur so?
Dank im vorraus,
der Dave
Nachtrag: ..ach irgendwie funktioniert die Google web Font jetzt auch nicht mehr ohne Doctype, sondern einfach gar nicht