如何修复由整体样式表触发的IE绝对定位CSS渲染错误？

Question

我遇到错误，Internet Explorer（11，边缘模式）应显示此信息：

但是显示它（注意右边的按钮）：

由于此页面的整体样式表中的最近（未知）更改，已触发错误： http://www.science.ku.dk/uddannelser/studenterservice/studenterservice_kopi/ 。此style.css不受我的控制，位于 http://cms.ku.dk/styling/css/style.css 。

我无法在本网站外重现此错误。

有趣的是， Internet Explorer在单击元素时正确呈现错误放置的元素，和/或从样式表中禁用并重新启用“div.wrapsklabel {bottom：0;}”时。

此版本中的页面在 https://blanketter.science.ku.dk/studenterservice/test.html 处正确呈现，不使用整体样式表。

我自己的代码非常简单，我认为，非常正确，所以现在我试图找出 style.css的哪一部分可能会触发我遇到的渲染错误？和我可以在自己的CSS中更改哪些内容来解决此问题？

以下是我的代码的相关部分：

CSS

div.stederss {
    display:table;
    border-collapse:separate;
    border-spacing: 15px;
}


div.stederss div.column1ss,
div.stederss div.column2ss {
    background-color: #f1f1f1;
    display:table-cell;
    *display:block;
    *float:left;
    *height:401px;
    *margin: 15px 0px 15px; 0;
    width:50%;
    *width:349px;
    padding:0px;
    font-size:11px;
    line-height:1.5em;
    position:relative;
}

div.stederss div.column1ss {
    border: 1px solid #97ad7c;
    *margin-right: 15px;
}

div.stederss div.column2ss {
    border: 1px solid #8AB7B4;
}

div.wrapsklabel {
    position:absolute;
    bottom:0;
    width:100%; 
}

div.overskrifthd {
    font-family: Noto Sans, Verdana;
    background-color: #97ad7c;
    color: #ffffff;
    padding: 17px 10px 17px 10px;
    text-transform: uppercase;
    font-size: 11pt;
}

div.overskriftsk {
    font-family: Noto Sans, Verdana;
    background-color: #8AB7B4;
    color: #ffffff;
    padding: 17px 10px 17px 10px;
    text-transform: uppercase;
    font-size: 11pt;
}

div.deklaration {
    padding: 15px 10px 10px 10px;
    background-color: #f1f1f1;
}   

.stederss input[type="radio"] {
    position: absolute;
    left: -5000px;
}


label.helpdesklabel {
    border-top: 1px solid black;
    display:block;
    font-family: Noto Sans, Verdana;
    background-color: #f1f1f1;
    color: #165aad;
    padding: 17px 10px 17px 10px;
    text-transform: uppercase;
    font-size: 10pt;
    cursor:pointer;
    text-align:center;
    font-weight: bold;
}

label.ssklabel {
    border-top: 1px solid black;
    display:block;
    font-family: Noto Sans, Verdana;
    background-color: #f1f1f1;
    color: #165aad;
    padding: 17px 10px 17px 10px;
    text-transform: uppercase;
    font-size: 10pt;
    cursor:pointer;
    text-align:center;
    font-weight: bold;
}   

HTML：

<div class="stederss">
    <div class="column1ss">
        <div class="overskrifthd">HELP DESK
        </div>

        <div class="deklaration">
            <strong>Få svar på praktiske og administrative spørgsmål om din uddannelse.</strong><ul><li>Spørgsmål om kursus- og eksamenstilmelding</li><li>Få bekræftet din studieaktivitet og dine indskrivningsforhold, fx til boligselskaber</li><li>Få rettet fejl i tilmeldinger eller registreringer</li><li>Lav navne- og adresseændring</li><li>Få karakterudskrifter</li><li>Få bekræftet kopi af dit eksamensbevis</li><li>Få rettet fejl i dit eksamensbevis</li><li>Udmeld dig af din uddannelse</li><li>Få registreret dit rigtige CPR-nummer</li></ul>
        </div>

        <div class="wraphelpdesksmall">
            <input id="2" type="radio" value="hd" name="sted">
            <label class="helpdesklabel" for="2">Klik for at kontakte<br> Help Desk</label>
        </div>
    </div>

    <div class="column2ss">

        <div class="overskriftsk">Studie- og karrierevejledningen
        </div>

        <div class="deklaration">
            <strong>Få vejledning i indhold, opbygning og regler for din uddannelse og få de bedste forudsætninger for et godt studieforløb.</strong><ul><li>Planlæg dit studieforløb og din tid</li><li>Træf velovervejede valg</li><li>Fasthold din motivation og håndter tvivl undervejs</li><li>Få sparring på dine karriereovervejelser</li><li>Kom af sted på udlandsophold</li><li>Få vejledning om ansøgninger, frister, dispensationer og klager</li><li>Håndter det svære, fx dumpede eksamener, sygdom og stress</li></ul>
        </div>

        <div class="wrapsklabel">
            <input class="sskknappen" type="radio" name="sted" value="ssk" id="1">
            <label class="ssklabel" for="1">Klik for at kontakte<br> Studie- og karrierevejledningen</label>
        </div>
    </div>

</div>

我已经使用 https://jsfiddle.net/hxgqrLa9/ 的代码创建了一个fidlle，但由于没有外部样式表而没有重现错误，我怀疑它有多大帮助。

感谢您提供的任何帮助。

Answer 1

你可以试试下面的几件事：

1. 避免在css中使用“.stederss input [type =”radio“] {”，而是使用类似“.stederss .radio {”之类的替代方法，并使用class =“radio”无论你在哪里输入type =“radio”......

2. 尝试检查使用永恒css时是否可以访问路径。

如果有效，请告诉我。