我的代码适用于Firefox和Edge，但不适用于Chrome，我哪里错了？

Question

我有一些代码可以在Firefox和Edge中运行，但在Chrome中没有，请任何人都可以帮助指出我做错了什么。

它们应该是三个盒子，它们在div的整个宽度上彼此相邻。

以下是Firefox呈现的方式，此处为Chrome。

编码很新，所以我希望我错过了一些非常明显的东西......

＆＃13;

＆＃13;

div.img2 {
    display: table-cell;
    border: 1px solid #ccc;
    width: 30%;
    margin: 5px;
}

div.img2:hover {
    border: 1px solid #72bf44;
    opacity: 0.8;
    filter: alpha(opacity=25);
}
div.img2 img {
    width: 50%;
    height: 50%;
    margin: 5px;
   display: block;
   margin-left: auto;
   margin-right: auto
}

div.desc2 {
    text-align: center;
}
.wrapper2{
    position:relative;
    overflow:hidden;
    margin-bottom:10px;
}

＆＃13;

<div class="wrapper2">
<div class="img2" style="padding: 20px;"><a href="http://www.carritech.com/contact-us/general-enquiries/">
<img src="http://www.carritech.com/wp-content/uploads/2013/04/Enquiry.png" alt="General Enquiries" width="526px" height="526px" />
</a>
<div class="desc2">
<h3><strong><a href="http://www.carritech.com/contact-us/general-enquiries/">General Enquiries</a></strong></h3>
</div>
</div>
<div class="img2" style="padding: 20px;"><a href="http://www.carritech.com/request-a-quote/">
<img src="http://www.carritech.com/wp-content/uploads/2013/04/Quote.png" alt="Request a Quote" width="526px" height="526px" />
</a>
<div class="desc2">
<h3><strong><a href="http://www.carritech.com/request-a-quote/">Request a Quote</a></strong></h3>
</div>
</div>
<div class="img2" style="padding: 20px;"><a href="http://www.carritech.com/telecommunications-company-information/feedback/">
<img src="http://www.carritech.com/wp-content/uploads/2013/04/Feedback.png" alt="Customer Feedback" width="526px" height="526px" />
</a>
<div class="desc2">
<h3><strong><a href="http://www.carritech.com/telecommunications-company-information/feedback/">Leave Feedback</a></strong></h3>
</div>
</div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

似乎在Chrome上工作正常，你应该清除缓存或在私人窗口中打开是我的猜测：