Position klebrig in Firefox 57 unterbrochen

-1

Ich versuche, Position klebrig zu verwenden, um eine klebrige Tabellenüberschrift zu machen.Position klebrig in Firefox 57 unterbrochen

Das folgende jsfiddle funktioniert in Chrome v64, funktioniert aber nicht in Firefox v57.

https://jsfiddle.net/b5fv94m0/

Gibt es eine zusätzliche CSS-I fehlt bin es in Firefox funktioniert?

CSS

.container { 
    height: 200px; 
    overflow: scroll; 
} 

th { 
    position: sticky; 
    top: 0; 
}

HTML

<div class="container"> 
<table> 
<thead> 
    <tr> 
    <th>Header</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
    <tr> 
    <td>Cell</td> 
    </tr> 
</tbody> 
</table> 
</div>

Quelle

2017-11-16 Andrew Davey

Ist Ihnen bekannt, dass Position: sticky eine experimentelle API ist und nicht in der Produktion verwendet werden sollte? https://developer.mozilla.org/en-US/docs/Web/CSS/position#sticky Browserkompatibilität: https://developer.mozilla.org/en-US/docs/Web/CSS/position#Browser_compatibility & https://caniuse.com/#search=position%3Asticky – UncaughtTypeError

Ah ja, ich sehe jetzt. Das Problem betrifft hauptsächlich, dass sticky noch nicht für Tabellenelemente funktioniert. –

Die meisten Browser nicht unterstützt werden Dieses position: sticky Attribut wie erwähnt ist es ein e experimentelle API. Verwenden Sie stattdessen position: fixed; für die Herstellung sticky.

Überprüfen Sie here für Browserkompatibilität.

Quelle

2017-11-16 10:03:09

Position: sticky

Diese CSS ist nicht kompatibel zu allen Browser besser so position: fixed verwenden

Quelle

2017-11-16 09:58:19

Position klebrig in Firefox 57 unterbrochen

Antwort

Verwandte Themen