zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden p:before + content:url (IE issues)

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 25.09.2011, 11:29
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard p:before + content:url (IE issues)

Hallo

Ich versuche jetzt seit Stunden einen CSS-Fehler auszubügeln, den ich so aus einem Tutorial übernommen hatte.
Um mich kurz zu fassen, es geht um die Sprechblase bei Kommentaren. Der kleine Pfeil rechts, wurde zuerst mit p:before dort angebracht:

Code:
#content #colLeft ul.commentlist li p:before {
content: url(http://www.zoomingjapan.com/wp-content/themes/alltuts/images/comment-arrow.png);
left: -36px;
top:-10px;
position: absolute;
}

#content #colLeft ul.commentlist li.comment-author-japanworm p:before {
content: url(http://www.zoomingjapan.com/wp-content/themes/alltuts/images/comment-arrow-author.png);
left: -36px;
top:-10px;
position: absolute;
}
Ich habe aber bald entdeckt, dass das viele Probleme mit sich bringt, z.B. wenn ich einen Absatz habe, erscheinen plötzlich ZWEI Pfeile! Gleiches gild für "blockquote". Das sieht dann sehr unschön aus.

Ich habe mir also überlegt, wie ich das evtl. anders gestalten könnte.
Folgendes schien perfekt zu funktionieren:

Code:
#content #colLeft ul.commentlist li .comment-meta:before {
content: url(http://www.zoomingjapan.com/wp-content/themes/alltuts/images/comment-arrow.png);
left: -36px;
top:-10px;
position: absolute;
}
Bis ich es dann im IE8 gegengecheckt habe und gesehen habe, dass die Pfeile dort nicht sichtbar sind.

Also aus der postion:absolute, eine position:relative gemacht und Werter entsprechend angepasst.
Wieder schien es zu funktionieren, bis ich im IE8 gegengeprüft habe.
Dort erscheinen nun die Pfeile so wie sie sollen, aber das von mir eingebaute "Author-highlight" greift plötzlich nicht mehr im IE!

Im Firefox funktioniert selbstverständlich alles wie gehabt.
Bevor ich jetzt noch weitere Stunden verschwende, dachte ich mir, fragen kann ja nicht schaden.

Hat hier irgendjemand eine gute Idee für eine elegantere Lösung?

Beispielseite
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 25.09.2011, 11:41
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Es funktioneirt doch im IE8.

Schon mal neu geladen die Webseite?
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 25.09.2011, 11:51
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Nein, es funktioniert leider nicht.
Hab sogar Cache geleert und neugestartet:

So sieht's im IE8 aus und so im Firefox
Mit Zitat antworten
  #4 (permalink)  
Alt 25.09.2011, 12:19
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

bei mir siehts in Fx genauso aus, wie in IE8. Wüsste auch nicht, wo dieser Bleistift herkommen soll... Da ist kein ::before definiert.

gruß,
take
Mit Zitat antworten
  #5 (permalink)  
Alt 25.09.2011, 14:35
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Hallo!

Was genau meinst du? Du siehst den Sprechblasen"pfeil" gar nicht? Weder im Firefox noch im IE?
Mit Zitat antworten
  #6 (permalink)  
Alt 25.09.2011, 14:44
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

Zitat:
Zitat von japanworm Beitrag anzeigen
Was genau meinst du? Du siehst den Sprechblasen"pfeil" gar nicht? Weder im Firefox noch im IE?
Sorry, ich hab Mist erzählt... In IE8 geht es bei mir (sh. Anhang), genauso wie im Fx und in Chrome.

gruß,
take
Angehängte Grafiken
Dateityp: png Zwischenablage02.png (17,0 KB, 9x aufgerufen)
Mit Zitat antworten
  #7 (permalink)  
Alt 25.09.2011, 14:50
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Danke für die Mühe

Das Problem, das ich im IE8 habe, ist ja vor allem, dass die "Adminerkennung" nicht funktioniert. Siehst du meine Kommentare in einer anderen Farbe als die anderen im IE? (das konnte ich bei dem Screenshot ja leider nicht erkennen)
Mit Zitat antworten
  #8 (permalink)  
Alt 25.09.2011, 15:02
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

das Problem existiert auch im IE9 und liegt an dem filter, mit dem du für die IEs den Gradient erzeugst. Warum das jetzt genau so ist hab ich mit den scheiß-Developer-Tools vom IE nicht rausgefunden, aber wenn man den Filter rausnimmt, ist das Admin-Bild und der veränderte Hintergrund zu sehen. Ich würde also in der CSS-Regel für die Admin-Posts den Filter wieder deaktivieren, dann sollte es auch der IE so darstellen wie du es haben willst.

gruß,
take
Mit Zitat antworten
  #9 (permalink)  
Alt 25.09.2011, 16:28
Benutzerbild von japanworm
Confuser
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 14.07.2011
Ort: Japan
Beiträge: 143
japanworm befindet sich auf einem aufstrebenden Ast
Standard

Ja, danke, das hat das Problem vorerst gelöst.
Vielleicht verwende ich statt den CSS Gradients lieber ein Hintergrundbild, damit es im IE auch dargestellt werden kann.
So nervig!!!

Im Kompabilitätsmodus haut's trotzdem alles zusammen. Da sieht mein ganzes Layout schrecklich aus. *IE verklopp*
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



Alle Zeitangaben in WEZ +2. Es ist jetzt 12:35 Uhr.