Safari rendert falsch nach Details Element bei Verwendung Rem Schriftgröße

Question

Safari 10.0.1 rendert Element nach einem Details Element falsch, wenn die Schriftgröße auf rem festgelegt ist. Die Elemente nach den Details mit Schriftgröße 1px gerendert.

HTML

<details> 
    <summary>Some details</summary> 
    <p>More info about the details.</p> 
</details> 
<ul> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
    <li>Lorem Ipsum</li> 
</ul> 

CSS

html{ 
    font-size: 1em; 
} 

ul { 
    font-size: 1rem; 
} 

Wenn Element wird rerendering (z Hover) Element get's neu gestrichen korrekt.

Gibt es einen Workaround?

Answer 1

Eine Problemumgehung ist, dass das Detailelement keine Standardwerte anzeigt und es über JavaScript anzeigt. Nicht sauber, aber funktioniert.

Answer 2

Besserer Workaround ist, kein Tag überhaupt zu verwenden, verwenden Sie stattdessen einen Standard. Dieser Fehler hat mich wochenlang verrückt gemacht, bis ich herausgefunden habe, wie man das Problem einfach beheben kann.

Scheint wie ein großer Fehler in Safari, die anderen Browser ordnungsgemäß zu rendern.

Answer 3

Haben Sie versucht, ems anstelle von rems zu verwenden?