我如何获得Internet Explorer＆amp; Opera正确显示此文本

Question

此网页div在Firefox和Chrome中正确显示

但在Internet Explorer和Opera中看起来很丑陋

我的HTML代码是：

            <div class="newAd">
                <span id="newAdButton">
                    Create a new advert for FREE!
                </span>
            </div>

CSS是：

.newAd {
    margin: 0 auto;
    margin-bottom: 25px;
    margin-top: 20px;
    width: 500px;
}

#newAdButton {
    margin: 10px 30px 10px 30px;
    padding: 10px 40px 10px 40px;
    background-color: #88FF88;
    color: #000000;
    font-size: 27px;
    border-radius: 20px;
    border: 5px solid #00FF00;
    -moz-border-radius: 20px; 
    -webkit-border-radius: 20px; 
    -o-border-radius: 20px;
    cursor: pointer;
    word-spacing: 0px;
}

请问如何让它适用于IE和Opera？感谢。

Answer 1

您可以使用按钮标记而不是span，并将id应用于按钮标记。 希望它能正常显示。

Answer 2

问题是您正在为该容器使用的边框。 Firefox和Chrome有外观，而显然IE和safari有内在（作为测试你可以删除边框，看看会发生什么）。尝试将box-sizing:border-box;用于#newAdButton。