Question

我在IE 8中使用带边框的一些简单链接文本获得了这种奇怪的行为。当单击下面的框时，IE会降低高度并加宽框，同时还会缩小边框内文本的大小。 ..

这是我的相关css：

.learn-more, .donate {
width: 20%;
position: absolute;
top: 172px;
border: 1px dashed black;
padding: 4px;
text-align: center;
}

这是我的HTML：

<div class="program-description">
<p><b>-Education: Primary Level-</b></p>
<p>A primary level education is where success begins and is the foundation needed for further education. U4U provides opportunities for destitute children to attend a reputable school and begin the journey to success.</p>
<a href="sponsorship.html" alt ="Learn more about Sponsorship" class="learn-more">Learn more</a>
<a href="https://squareup.com/market/unified-for-uganda/sponsorship" target="_blank" alt="Donate to Sponsorship"class="donate">Donate</a>
</div>

我确实有一个normalize.css表，但是这真的导致了冲突吗？我一直在讨论这个问题......

这里是现场：http://unifiedforuganda.com/ugandanprograms.html

Answer 1

Normalize.css设置a：focus和a：访问标准（没有边框样式）。发生了什么事情是你已经将.learn-more，.donate应用于a并给它们一个边框，但你还没有处理你的风格中的访问版本：所以链接恢复为默认值并丢失边框。只需在样式表中为这些样式提供CSS覆盖

.learn-more:visited, .donate:visited {

    width: 20%;
    position: absolute;
    top: 172px;
    border: 1px dashed black;
    padding: 4px;
    text-align: center;
}

即点击时8个链接移动

1 个答案: