"Christmas - the time to fix the computers of your loved ones" « Lord Wyrm

Problem mit CSS-transform und Browser-Kompatibilität

schizo 16.01.2016 - 19:30 2118 11
Posts

schizo

Produkt der Gesellschaft
Avatar
Registered: Feb 2003
Location: Vienna
Posts: 2542
Ich hab vor etwa 3 Jahren eine Seite geschrieben, bei der ein um 90° gedrehter Text angezeigt wird. Seit ~einem Monat wird der Text jedoch nicht mehr gedreht angezeigt. Jedoch hab ich leider keine Ahnung, womit das zusammenhängen könnte.

Hat jemand einen Tipp, wo ich zu suchen beginnen könnte?

Code: CSS
.verticalText
{
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    width: 20px;
    margin: 0px;
    padding: 0px;
    white-space: nowrap;

    /* Safari */
    -webkit-transform: rotate(270deg);
    /* Firefox */
    -moz-transform: rotate(270deg);
    /* IE */
    -ms-transform: rotate(270deg);
    /* Opera */
    -o-transform: rotate(270deg);
    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

    transform: rotate(270deg);

    writing-mode: tb-rl;
    filter: flipv fliph;
};

Code: HTML
<th><div class="verticalText">Punkte</div></th>

kleinerChemiker

Here to stay
Avatar
Registered: Feb 2002
Location: Wien
Posts: 4282
In allen Browsern?

schizo

Produkt der Gesellschaft
Avatar
Registered: Feb 2003
Location: Vienna
Posts: 2542
Ah, danke für den Hinweis - im Opera 34 funktionierts.
Im FF 43 und IE 11 hab ich jedoch das Problem.

Hats im IE da irgendeine Änderung gegeben, die vom FF übernommen wurde?
Bearbeitet von schizo am 16.01.2016, 20:30

kleinerChemiker

Here to stay
Avatar
Registered: Feb 2002
Location: Wien
Posts: 4282
Kenne mich da nicht so aus, hab nur unlängst das gelsesen: http://www.heise.de/newsticker/meld...nz-3063924.html

Keine Ahnung, ob das damit zu tun haben kann.

11Fire01

Here to stay
Registered: Dec 2002
Location: austria
Posts: 2417
hast du die seite für jemanden geschrieben, welcher sie drei jahre in verwendung hatte?

dann würde ich dort suchen, wo etwas verändert wurde - in den letzten drei jahren :_D. Hast du den code mal alleine getestet auf einer anderen index.html?

edit: vllt ist es jedoch der smiley mitten im code :cool:

edit2: writing-mode: tb-rl; <- wenn ich das lösche ists vertikal
Bearbeitet von 11Fire01 am 17.01.2016, 08:07

mat

Administrator
Legends never die
Avatar
Registered: Aug 2003
Location: nö
Posts: 25423
Es gibt auch multiple filter-Statements. IE wird nur das letzte Statement verarbeiten und ignoriert damit das XImageTransform. Abgesehen davon solltest du für IE10+ keine filter mehr verwenden. Wenn du ältere IEs unterstützen möchtest dann mach ein eigenes Stylesheet mittels IE-Weiche.

-=Willi=-

The Emperor protects
Avatar
Registered: Aug 2003
Location: ~
Posts: 1624
Code: CSS
writing-mode: tb-rl;
ist der Verursacher. Das Problem hat übrigens nichts mit PHP zu tun :D.

mat

Administrator
Legends never die
Avatar
Registered: Aug 2003
Location: nö
Posts: 25423
Fixed.

schizo

Produkt der Gesellschaft
Avatar
Registered: Feb 2003
Location: Vienna
Posts: 2542
Zitat von -=Willi=-
Code: CSS
writing-mode: tb-rl;
ist der Verursacher. Das Problem hat übrigens nichts mit PHP zu tun :D.

Thx das wars. Das es sich um kein PHP Problem handelt is mir nachher auch aufgefallen, allerdings war ich zu faul, um den Threadtitel zu ändern :P

Warum tb-rl einzug gefunden hat kann ich leider nicht mehr nachvollziehen. Die Seite lief jedoch nur auf meinem Server und es hatte sonst niemand Zugriff auf das Script. Auch in den Backups finde ich den String. Hat jemand eine Erklärung parat, warum das Problem erst jetzt aufgetreten ist?
Ich bild mir ein, dass ichs damals auch im IE getestet hab und im Firefox hats eben bis vor kurzem noch funktioniert.

-=Willi=-

The Emperor protects
Avatar
Registered: Aug 2003
Location: ~
Posts: 1624
Keine Ahnung warum das erst jetzt aufgetreten ist. Updates könnens ja eher nicht gewesen sein weil "writing-mode: tb-rl" laut MDN und Google veraltet und ein Hack für <=IE7 ist. ¯\_(ツ)_/¯

kleinerChemiker

Here to stay
Avatar
Registered: Feb 2002
Location: Wien
Posts: 4282
Gab scheinbar Änderungen mit FF 43.
https://developer.mozilla.org/de/do...SS/writing-mode
Bearbeitet von kleinerChemiker am 17.01.2016, 18:18

schizo

Produkt der Gesellschaft
Avatar
Registered: Feb 2003
Location: Vienna
Posts: 2542
Das würd sich auch zeitlich mit dem release decken, also dürfte das wohl der Grund sein.
Danke für die Hilfe.
Bearbeitet von schizo am 17.01.2016, 18:30
Kontakt | Unser Forum | Über overclockers.at | Impressum | Datenschutz