我的网站是http://ww2.hawaiidiscount.com/,我可以让所有浏览器上的岛盒对齐,除了Safari,它们会在另一个下面显示一个。我使用以下css脚本。我曾经有过这个问题,但能够通过添加:
来修复它.homebox li {
display: inline-block;
zoom: 1;
*display: inline;
padding-right:20px;
}
这在所有浏览器上修复了它,但由于某种原因它在Safari中不再有效。我将不胜感激如何解决这个问题。谢谢大家!
#boxbg {
width: 100%;
height:41px;
background-image: url("http://ww2.hawaiidiscount.com/Portals/0/yellowboxbg.jpg");
background-repeat: repeat-x;
}
#yellowboxtitle {
text-align:center;
clear:both;
color:#fff;
font-family:Verdana, Geneva, sans-serif;
text-transform: uppercase;
display: block;
margin: 0 auto;
font-weight:bold;
line-height:1.5em;
font-size:1.5em;
text-shadow: 1px 1px 2px #000, 0px 0px 3px #0000A0;
}
#BigIslandHome {
margin:0 auto;
width:190px;
height:200px;
transition: background-image 1s ease-in-out;
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/BigIsland-2.jpg");
}
#BigIslandHome:hover {
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/BigIsland-hover-2.jpg");
}
#OahuHome {
margin:0 auto;
width:190px;
height:200px;
transition: background-image 1s ease-in-out;
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Oahu-2.jpg");
}
#OahuHome:hover {
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Oahu-hover-2.jpg");
}
#KauaiHome {
margin:0 auto;
width:190px;
height:200px;
transition: background-image 1s ease-in-out;
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Kauai-2.jpg");
}
#KauaiHome:hover {
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Kauai-hover-2.jpg");
}
#MauiHome {
margin:0 auto;
width:190px;
height:200px;
transition: background-image 1s ease-in-out;
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Maui-2.jpg");
}
#MauiHome:hover {
background-image:url("http://ww2.hawaiidiscount.com/Portals/0/Maui-hover-2.jpg");
}
.yellow-cont {
width: 100% !important;
float: right;
}
.homebox {
background:#F0BF00;
max-width:100%;
display: block;
margin-left: 20px;
}
/* ADDED */
.homebox li {
display: inline-block;
zoom: 1;
*display: inline;
padding-right:20px;
}
.homeislands {
display: block;
text-align: center;
padding-top: 26px;
padding-bottom: 26px;
margin: 0 auto;
clear:both;
}
#homecategory {
display: block;
text-align: center;
padding-top: 26px;
margin-bottom: 1px;
}