Rounded Corners

[Chaffinch<]

Hallo an alle.
So erstellen Sie eine "Rounded Corners" für "container".
Beispiel:
http://webdesign-dp.de/pepes-sandbox/pe ... 2010.phtml
In der Firefox Ich habe "Rounded Corners"
In der Ie 8 nicht
Vielen Dank im Voraus für eure Hilfe
Bogdan

[update]

Pepes Lösung arbeitet mit CSS3 und nicht alle Browser unterstützen das. Aber alle neuen Browser sollten "border-radius" unterstützen

Schau mal, hier gibt es eine Lösung für den IE<9
http://blog.panthera-it.com/2010/03/bor ... ssbrowser/

In der Ie 8 nicht

Nein, erst ab IE9 gibt es mehr CSS3- Support

[Chaffinch<]

Pepes Lösung arbeitet mit CSS3 und nicht alle Browser unterstützen das. Aber alle neuen Browser sollten "border-radius" unterstützen

Schau mal, hier gibt es eine Lösung für den IE<9
http://blog.panthera-it.com/2010/03/bor ... ssbrowser/

In der Ie 8 nicht

Nein, erst ab IE9 gibt es mehr CSS3- Support

Es ist schade, dass es keine Lösung für dieses Problem.
Vielen Dank für Ihre Antwort.
Freundlichen
Bogdan
Postscriptum.
Ich fand eine Version, die IE8 unterstützt
http://www.curvycorners.net/downloads/
Aber es ist noch ein Problem für mich, eine Implementierung für phpWCMS

[update]

Schau mal, hier gibt es eine Lösung für den IE<9
http://blog.panthera-it.com/2010/03/bor ... ssbrowser/

Hat das nicht funktioniert? Das ist doch für IE8 und so weiter (IE9 kann es ja)

[Chaffinch<]

Schau mal, hier gibt es eine Lösung für den IE<9
http://blog.panthera-it.com/2010/03/bor ... ssbrowser/

Hat das nicht funktioniert? Das ist doch für IE8 und so weiter (IE9 kann es ja)

Auf dieser Seite funktioniert.
I downloaded dieses Script.
Aber ich weiß nicht, wie zu installieren in meiner phpWCMS
Für die Arbeit mit Pepes Template
http://www.krynica.malopolska.pl/index.php?test

[update]

In Deine frontend-rounded.css:

Code: Select all

.rounded-corners {
border:1px solid #dddddd;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
/* für IE */
behavior: url(/template/inc_css/special/border-radius.htc);
/* bringen wir dem IE border-radius auch bei*/
}

Das heruntergeladene border-radius.htc kommt in /template/inc_css/special/border-radius.htc
Fertig. Testen...

[Chaffinch<]

In Deine frontend-rounded.css:

Code: Select all

.rounded-corners {
border:1px solid #dddddd;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
/* für IE */
behavior: url(/template/inc_css/special/border-radius.htc);
/* bringen wir dem IE border-radius auch bei*/
}

Das heruntergeladene border-radius.htc kommt in /template/inc_css/special/border-radius.htc
Fertig. Testen...

Hi Claus
Ich habe eine Datei auf der border-radius.htc
.. /template/inc_css/specific/border-radius.htc und .. /template/inc_css/special/border-radius.htc
Ich merke nicht, Änderungen
Danke schön für Ihre Zeit

[update]

In Deine frontend-rounded.css:

.rounded-corners {
border:1px solid #dddddd;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
/* für IE */
behavior: url(/template/inc_css/special/border-radius.htc);
/* bringen wir dem IE border-radius auch bei*/
}

[Chaffinch<]

In Deine frontend-rounded.css:

.rounded-corners {
border:1px solid #dddddd;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
/* für IE */
behavior: url(/template/inc_css/special/border-radius.htc);
/* bringen wir dem IE border-radius auch bei*/
}

Dear Claus
Verzeihen Sie mir bitte.
Ich verstehe nicht, Weisungen.
Ich bin begeistert von dem Skript, aber kein Programmierer.
Könnten Sie mehr einfach zu erklären
Sehr herzlich bitte
Bogdan

[update]

Bitte einfügen in Deine frontend-rounded.css

Code: Select all

behavior: url(/template/inc_css/special/border-radius.htc);

Jetzt sieht der Inhalt der frontend-rounded.css so aus:

Code: Select all

/* =============================================================== */
/* frontend-rounded.css                  Version: 17.10.2009-18:00 */                                                                   
/* =============================================================== */


.rounded-corners-top {
   border: 1px solid #ddd; 

   -moz-border-radius-topleft:  6px;
   -moz-border-radius-topright: 6px;
   -webkit-border-top-left-radius:  6px;
   -webkit-border-top-right-radius: 6px;
}

.rounded-corners { 
/*   background: #e7ebef; */
   border: 1px solid #ddd; 
   border-radius: 6px;
   -moz-border-radius: 6px;
   -webkit-border-radius: 6px;
   behavior: url(/template/inc_css/special/border-radius.htc);
}

.rounded-corners-bottom {
   border: 1px solid #ddd; 

   -moz-border-radius-bottomleft:  6px;
   -moz-border-radius-bottomright: 6px;
   -webkit-border-bottom-left-radius:  6px;
   -webkit-border-bottom-right-radius: 6px;



}

[update]

Wenn es nicht geht, dann liegt das an der Pfadangabe, ich glaube, die behavior-Angabe braucht einen relativen Pfad:

Code: Select all

behavior: url(template/inc_css/special/border-radius.htc);

oder

Code: Select all

behavior: url(special/border-radius.htc);

Probieren!