谷歌浏览器上的HTML / CSS渲染问题

Question

我正在学习PHP（在学习了HTML，CSS等基础知识之后）。 我正在尝试建立一个网站，你可以将主要部分切成三个部分（一个宽15％，一个宽70％，另一个宽15％）。

问题是15％的部分都可以在Internet Explorer和Firefox上正常运行，但由于某些未知原因在Google Chrome上消失了。

这是代码的HTML部分：

    <!-- First Section (Desktop only) -->
    <div class="side_banner">
        <img src="images/asd.gif" id="bannerlong"/>
        <img src="images/asd2.png" id="bannerwide"/>
    </div>

这是代码的CSS部分：

.side_banner {
    width: 15%;
    float: right;
    padding: 20px;
    margin: auto;
    text-align: center;
    padding-top: 120px;
}

.side_banner img {
    padding: 10px;
}    

#bannerwide {
    display: none;
}

.phone_banner {
    display: none;
}

带有“display：none;”的那些适用于其他视口...

一个重要的线索可能是，当文件有一个HTML扩展时，它在chrome上工作正常，但当我将其更改为PHP扩展（并通过WAMP打开）时，问题出现了。 < / p>

您能帮我找一下Chrome浏览器上我的网页出现问题的原因吗？

非常感谢！