我正在尝试为我正在处理的项目创建一个不错的悬停效果，并且隐藏的溢出似乎在 safari 中不起作用看看。学习.michaelscimeca.com
HTML：
<div class="thumnnail">
<img class="mainbg" src="img/shoppee.jpg" alt="">
<div class="textbox">
<img src="/img/eye.png" alt="">
<span class="launch"><a href="http://www.shoppedelee.com">View Project</a></span>
</div>
</div>
CSS：
.thumnnail .textbox .launch a {
margin-left: -78px;
text-align: center;
margin-top: 10px;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
padding: 15px 40px;
position: absolute;
top: 45px;
left: 50%;
background-color: #1c51c8;
border-radius: 100%;
text-transform: uppercase;
-ms-transition: all .5s ease;
/* this is for the animation effect to bring the textbox down to up and up to down */
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.thumnnail .textbox .launch a:hover {
background-color: #093db4;
}
.thumnnail:hover {
border: 10px solid #0d46c8;
/* this is to alter the border on rollover */
border-radius: 100%;
/* this is to round out the div tag */
/* to get rid of the greyscale on rollover */
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
-ms-filter: grayscale(0%);
overflow: hidden! important;
}
.thumnnail:hover img {
/* width:120%;
height:120%;*/
}
.thumnnail:hover .textbox {
height: 100px;
}