zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden IE - runde Ecken mit Transparenz ohne Grafiken?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 14.03.2011, 15:38
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2011
Beiträge: 31
freshUser befindet sich auf einem aufstrebenden Ast
Frage IE - runde Ecken mit Transparenz ohne Grafiken?

Hallo,
der Internet Explorer ärgert mich schon wieder seit stunden.
Habe auch einiges zum thema Runde Ecken und Transparenz im IE gelesen aber leider komme ich auf keine Lösung.

Hier mein Ansatz:

PHP-Code:
 <style type="text/css">
.
round-corners {
    
background-colorrgba(255,255,255,0.5);
    
padding:20px;
    -
moz-border-radius15px;
    -
webkit-border-radius15px;
    
border-radius15px;
    
behaviorurl(border-radius.htc);
}
</
style
IE fixes css
PHP-Code:
<!--[if IE]>
<
style type="text/css">
.
round-corners
    
background-color:#fff;
     
-ms-filter"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"
}
</
style>
<![endif]--> 

hier funktioniert nur entweder transparenz oder runde ecken.

hatte außerdem noch einen verlauf mit transparenz versucht

PHP-Code:
<!--[if IE]>
<
style type="text/css">

   .
round-corners {
       
background:transparent;
       
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50ffffff,endColorstr=#50ffffff);
       
zoom1;
    } 

</
style>

<![endif]--> 
brachte aber auch nicht das gewünschte ergebnis.

Hier noch die htc dateien die ich probiert habe:
curved-corner - Project Hosting on Google Code

CSS3 support in Internet Explorer 6, 7, and 8



Geändert von freshUser (14.03.2011 um 15:46 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 14.03.2011, 16:37
Benutzerbild von Chris2011
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 04.01.2011
Beiträge: 301
Chris2011 befindet sich auf einem aufstrebenden Ast
Standard

änder den doctype doch mal vieleicht bringt das was. <!DOCTYPE HTML>
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 14.03.2011, 16:52
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2011
Beiträge: 31
freshUser befindet sich auf einem aufstrebenden Ast
Unglücklich

Hi Chris,
doctype habe ich den minimalsistischen HTML5 doctype. Habe auch schon andere ausprobiert das hilft leider nicht

...
Mit Zitat antworten
  #4 (permalink)  
Alt 14.03.2011, 17:30
Benutzerbild von Chris2011
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 04.01.2011
Beiträge: 301
Chris2011 befindet sich auf einem aufstrebenden Ast
Standard

hab gelesen du brauchst eine htc-datei für den IE
border-radius.htc - curved-corner - Border radius htc v3 with IE6, 7 & 8 support - Project Hosting on Google Code

dann musst du deine css-datei mit dieser zeile ergänzen

Code:
behavior: url(border-radius.htc);
Mit Zitat antworten
  #5 (permalink)  
Alt 14.03.2011, 18:57
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2011
Beiträge: 31
freshUser befindet sich auf einem aufstrebenden Ast
Standard

..schau Dir mein beispiel nochmal genau an htc hab ich drin.
wie gesagt sobald ich die Nutze funktioniert die transparenz nicht mehr.
Mit Zitat antworten
  #6 (permalink)  
Alt 14.03.2011, 19:14
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Ist hier irgendwo ein Link zu deinem Problem?
Ohne kann dir bestimmt niemand sinnvoll helfen. Codeschnipsel sind bei solchen Problemen noch nutzloser als sonst.
http://xhtmlforum.de/40080-f-r-frage...twortende.html
Mit Zitat antworten
  #7 (permalink)  
Alt 14.03.2011, 20:16
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2011
Beiträge: 31
freshUser befindet sich auf einem aufstrebenden Ast
Standard

Hallo fricca,
das ist der komplette code der zu einem Beispiel nötig ist.
einfach die klasse auf ein div anwenden und fertig
Mit Zitat antworten
  #8 (permalink)  
Alt 14.03.2011, 20:20
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Ich mische mich mal frecherweise ein:

Das ist deine Ansicht, freshuser....
lade doch mal einen testcase hoch. Alleine die Reduzierung des Problems auf ein testcase könnte nämlich zeigen, dass dein Problem woanders liegt. Wie zumindest meine Erfahrungen zeigen, können MS-Filter unerwartete Wirkungen haben, wenn sie mehrfach gestapelt werden - das heißt, nicht nur im konkreten Element, sondern auch - oder andere Filter - im Eltern- oder Großelternelement verwendet werden.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #9 (permalink)  
Alt 14.03.2011, 20:23
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2011
Beiträge: 31
freshUser befindet sich auf einem aufstrebenden Ast
Standard

PHP-Code:
<!DOCTYPE HTML>
<
html>
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<
title></title>
<
style type="text/css">
bodybackground-color:#666; }
#box{ width:200px; height:200px; }

.round-corners {
    
background-colorrgba(255,255,255,0.5);
    
padding:20px;
    -
moz-border-radius15px;
    -
webkit-border-radius15px;
    
border-radius15px;
    
behaviorurl(border-radius.htc);
}
</
style


<!--[if 
IE]>
<
style type="text/css">
.
round-corners
    
background-color:#fff;
     
-ms-filter"progid:DXImageTransform.Microsoft.Alpha(opacity=50)"
}
</
style>
<![endif]-->   


</
head>

<
body>
<
div id="box" class="round-corners">
</
div>


</
body>
</
html

die dazugehörige htc datei gibt es hier zum download incl. beispielen:
http://code.google.com/p/curved-corner/

wie gesagt was ich nicht hinbekomme sind runde ecken + transparenz im Internet Explorer. (immer nur eins von beidem)

Geändert von freshUser (14.03.2011 um 20:33 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 14.03.2011, 21:04
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Mach et online

Es ist sowieso schon ein Extra, wenn ich mir deinen Code lokal anschaue...
ich WILL KEINEN EXTRACODE runterladen /installieren/sonstwas müssen und wenn es nur einen bescheidene Kleindatei ist.

Irgendein Nocost-account bei einem freehoster reicht dafür.

Davon abgesehen hält Microsoft große Stücke auf ihre Filter, die natürlich alle prima miteinander - auch mehrfach - auf einem Element funktionieren sollen.
Wenn was gescriptet oder nachgeladen wird, wäre es ggf. hilfreich, den parameter .enabled=[Zahl] hinzuzufügen. mehr gibts auf Microsofts Filterseite, die Du sicherlich kennst.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Runde Ecken mit Hintergrund Phil2812 CSS 0 04.09.2010 18:14
Runde Ecken und Transparenz: ich beiss mir die Zähne aus Dwarf CSS 4 13.05.2007 19:10
Runde Ecken, abstand zum Rand denny CSS 0 04.06.2004 19:53
Runde Box (bzw. runde Ecken) l2107 CSS 3 08.02.2004 04:19


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:43 Uhr.