[IE] Der IE kann lediglich 31 Style-Objekte laden (jeweils max. 288Kb)
Posted by skoch on 30. April 2009Schmerzlich musste ich wieder einmal feststellen, das unser geliebter Internet Explorer so seine Beschränkungen Limitierungen hat.
Existieren in einer HTML Datei mehr als 31 Style-Objekte, werden alle ab dem 32. ignoriert. Dazu zählen sowohl eingebundene Stylesheets (“<link rel…>“; “@import…“) als auch Bereiche, die in einen style-Tag (<style>…</style>) eingeschlossen sind.
Lösung hierfür ist das Anlegen einer Stylesheet-Datei, die ihrerseits weitere Stylesheets per @import lädt!
Außerdem gibt es eine Limitierung der Dateigröße auf 288 Kb für eingebundene Stylesheets. Größere Dateien werden ignoriert.
Betroffen ist der Internet Explorer 6 und 7. Die Version 8 habe ich noch nicht getestet, glaube aber ehrlich gesagt nicht daran, das es hier viel flexibler wird.
Natürlich stellt sich die Frage, ob es sinnvoll ist, mehr als 32 Style-Objekte in eine Seite einzubinden. Dazu verfasse ich vielleicht irgendwann einen separaten Blogeintrag!
Einfacher Test:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>IE Limit 32 Style-Objekte</title>
<style>#layer1 { color: red; }</style>
<style>#layer2 { color: red; }</style>
<style>#layer3 { color: red; }</style>
<style>#layer4 { color: red; }</style>
<style>#layer5 { color: red; }</style>
<style>#layer6 { color: red; }</style>
<style>#layer7 { color: red; }</style>
<style>#layer8 { color: red; }</style>
<style>#layer9 { color: red; }</style>
<style>#layer10 { color: red; }</style>
<style>#layer11 { color: red; }</style>
<style>#layer12 { color: red; }</style>
<style>#layer13 { color: red; }</style>
<style>#layer14 { color: red; }</style>
<style>#layer15 { color: red; }</style>
<style>#layer16 { color: red; }</style>
<style>#layer17 { color: red; }</style>
<style>#layer18 { color: red; }</style>
<style>#layer19 { color: red; }</style>
<style>#layer20 { color: red; }</style>
<style>#layer21 { color: red; }</style>
<style>#layer22 { color: red; }</style>
<style>#layer23 { color: red; }</style>
<style>#layer24 { color: red; }</style>
<style>#layer25 { color: red; }</style>
<style>#layer26 { color: red; }</style>
<style>#layer27 { color: red; }</style>
<style>#layer28 { color: red; }</style>
<style>#layer29 { color: red; }</style>
<style>#layer30 { color: red; }</style>
<style>#layer31 { color: red; }</style>
<style>#layer32 { color: red; }</style>
</head>
<body>
<div id="layer1">layer1</div>
<div id="layer2">layer2</div>
<div id="layer3">layer3</div>
<div id="layer4">layer4</div>
<div id="layer5">layer5</div>
<div id="layer6">layer6</div>
<div id="layer7">layer7</div>
<div id="layer8">layer8</div>
<div id="layer9">layer9</div>
<div id="layer10">layer10</div>
<div id="layer11">layer11</div>
<div id="layer12">layer12</div>
<div id="layer13">layer13</div>
<div id="layer14">layer14</div>
<div id="layer15">layer15</div>
<div id="layer16">layer16</div>
<div id="layer17">layer17</div>
<div id="layer18">layer18</div>
<div id="layer19">layer19</div>
<div id="layer20">layer20</div>
<div id="layer21">layer21</div>
<div id="layer22">layer22</div>
<div id="layer23">layer23</div>
<div id="layer24">layer24</div>
<div id="layer25">layer25</div>
<div id="layer26">layer26</div>
<div id="layer27">layer27</div>
<div id="layer28">layer28</div>
<div id="layer29">layer29</div>
<div id="layer30">layer30</div>
<div id="layer31">layer31</div>
<div id="layer32">layer32 (dieser Text ist im IE nicht rot, da das letzte Style-Objekt ignoriert wird)</div>
</body>
</html>
Leave a Reply
You must be logged in to post a comment.