<ul class="gallery" >
<li><a href="images/Galary/1_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/1_full.jpg" alt="image" /><span class="photo"></span></a></li>
<li><a href="images/Galary/2_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/2_full.jpg" alt="image" /><span class="photo"></span></a></li>
<li><a href="images/Galary/3_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/3_full.jpg" alt="image" /><span class="photo"></span></a></li>
<li><a href="images/Galary/4_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/4_full.jpg" alt="image" /><span class="photo"></span></a></li>
<li><a href="images/Galary/5_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/5_full.jpg" alt="image" /><span class="photo"></span></a></li>
<li><a href="images/Galary/6_full.jpg" rel="prettyPhoto[gallery1]" title=""><img src="images/Galary/mini/6_full.jpg" alt="image" /><span class="photo"></span></a></li>
</ul>
.gallery {
list-style: none;
margin: 0;
padding: 0;
}
.gallery ul {
list-style: none;
margin: 0;
float: right;
list-style: none;
position: relative; /*--Set relative positioning on the unordered list itself - not on the list item--*/
}
.gallery li {
margin: 10px;
padding: 0;
float: left;
position: relative;
width: 180px;
height: 135px;
}
.gallery img {
background: #fff;
border: solid 1px #ccc;
padding: 4px;
}
.gallery span {
width: 20px;
height: 18px;
display: block;
position: absolute;
bottom: 10px;
right: 10px;
}
.gallery .photo {
background: url(../all_images/content/photo.gif) no-repeat;
}
.gallery a:hover img {
border-color: #666;
}
.gallery a:hover span {
background-position: left -22px;
}
И казалось бы все хорошо , но данный список не работает в IE то есть он там отобраджается как столбец а в mzila opera как линия, ну или если места нехватает то переходит на другую строку.
Что это?
