Border-Radius (CSS3) unter IE7 und IE8

**robert712** · 27.08.2011 20:53

Hallo zusammen,

ich habe nur ne Frage bez. dem "neuen" CSS3 und IE7 und IE8.

CSS3 bringt das Attribut "border-radius" mit einer Pixel-Angabe mit, womit in einem DIV abgerundete Ecken erzeugt werden können. Ich war erstmal super froh drum, als ich des gelesen hab und hab es bei einem neuen Projekt gleich eingesetzt. Aber nun hab ich des Problem (wieder mal) mit den alten InternetExplorern.

Hat jemand ein Workaround für abgerundete Divs unter IE7 und IE8? Kann man dem IE irgendwie nachträglich die CSS3-Fähigkeit beibringen?

HTML-Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta **********="content-type" content="text/html; charset=windows-1250">
  <title>Experiment Border-Radius</title>
  <style type="text/css">
    <!--
      body {
      	background-color: #ddd;
      	margin: 75px;
      }
    
      #roundedwrapper {
      	background-color: #eeffff;
      	height: 200px;
      	
        /* How does this work in IE7 and IE8 ? */
      	border-radius: 15px;
      	
      	padding: 10px;
      }
    -->
  </style>
  </head>
  <body>
  
    <div id="roundedwrapper">
          Lorem Ipsum...
    </div>

  </body>
</html>

**Lintzy** · 27.08.2011 21:02

Hierbei hilft dir CSS3 Pie weiter.

**Helrunar** · 27.08.2011 22:07

http://www.bloggerschmidt.de/blog/it...-template.html

**robert712** · 28.08.2011 19:46

Hallo,

vielen Dank für das Super und vorallem schnelle Feedback. Ich hät am Samstag abend ned innerhalb von 10min ne Antwort erwartet. Ich hab das Ganze mal außerhalb von Joomla in einer einfachen HTML-Datei getestet. Einwandfrei!

Dann innerhalb eines Joomla-Templates. Vor dem zweiten Thread hab ich das behaviour in der css-Datei angegeben. Doch aus welchen Gründen auch immer konnte er keinen relativen Pfad auflösen. Erst wenn ich den kompletten Pfad (http://www.test.de/bla/blub/.../) zu der PIE-Datei angegeben hab, hat erst akzeptiert. Durch die Infos in dem zweiten Thread reicht es aus, wenn man in der index.php des Templates die bevaviour-Zeile zu der PIE-Datei relativ angibt. Leider funktioniert das nicht so ganz.

Code:

Code:

<!--[if lte IE 8]>
  <style type="text/css">
    #pieForRoundedBorders {behavior:url(<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/themes/<?php echo $color ?>/js/PIE.htc);}
  </style>
<![endif]-->

Ich hab nun mal diese Adresse als a href-Link in der index.php angelegt. Und siehe da. Der Pfad stimmt. Ich kann die Datei downloaden.

**poti** · 28.08.2011 20:38

Der Autor meine auch das im zusammenhang mit Seo/sef es sein kann das der Pfad abgeändert werden muss. Leuchtet mir zwar nicht richtig ein, ist aber anscheinend so.

**downunder2003** · 28.08.2011 21:26

Hallo Robert,

Ich habe PieCSS auf mehreren Seiten produktiv im Einsatz. Nach längerem Testen läuft's bei mir am Besten, wenn ich die behavior: url direkt in der CSS angebe, und zwar als absoluter Pfad. Dann funktioniert's eigentlich auch immer.
Alle andere Varianten habe ich auch nie wirklich hin gekriegt... :=)

Nur mit IE9 musst Du aufpassen: WEnn Du zu Testzwecken die Seite im Kompabilitäsmodus lädst, musst Du öfters mal den Cache noch von Hand löschen gehen, damit die PIE Anweisungen dann auch umgsetzt werden

**Helrunar** · 28.08.2011 21:36

Zitat von downunder2003

Nur mit IE9 musst Du aufpassen

Der IE9 brauch kein css3pie mehr, der kann das in der zwischenzeit alles von Haus aus

**downunder2003** · 28.08.2011 21:39

Jepp, Recht Hast Du Helrunar,

Vielleicht hab ich mich etwas unklar ausgedrückt. Ich meinte, dass bei mir der IE9 im Kompablitätsmodus (Browsercheck) manchmal Macken macht mit der PIE Datei laden.
Da ich keine IE8 oder 7 mehr installiert habe, muss ich ja mit dem 9 im Kompabilitäsmodus testen, oder?

Gruss
Michael

**robert712** · 29.08.2011 20:00

Zitat von downunder2003

Hallo Robert,

Ich habe PieCSS auf mehreren Seiten produktiv im Einsatz. Nach längerem Testen läuft's bei mir am Besten, wenn ich die behavior: url direkt in der CSS angebe, und zwar als absoluter Pfad. Dann funktioniert's eigentlich auch immer.
Alle andere Varianten habe ich auch nie wirklich hin gekriegt... :=)

Nur mit IE9 musst Du aufpassen: WEnn Du zu Testzwecken die Seite im Kompabilitäsmodus lädst, musst Du öfters mal den Cache noch von Hand löschen gehen, damit die PIE Anweisungen dann auch umgsetzt werden

Hmm. Mit der absoluten URL in der CSS-Datei gehts. Aber wenn ich dann irgendwann die Domain umstell, oder irgendwas andres, muss ma drandenken, dass ma des nachzieht ;-)

Thema: Border-Radius (CSS3) unter IE7 und IE8

LinkBack

Themen-Optionen

Thema durchsuchen

Anzeige

Border-Radius (CSS3) unter IE7 und IE8

Erhielt Danksagungen von:

Erhielt Danksagungen von:

Lesezeichen

Lesezeichen

Berechtigungen