Log in

View Full Version : Lightbox 2 display problem in IE6



celest
03-18-2010, 06:43 PM
Dear all,

I'm trying to add a gallery using lightbox 2 on my website.
But I'm having problem with IE6, the box expand the div down itself on IE6,
It look fine in other browser i test using adobe lab browser, except IE6.
I've tried to google but I can't find the solution, I'm not a profesional, so I hope someone can help me..:confused:

Here is the gallery css which I combined with my other css for the site lay out,
I'm sorry it's a long list.

Here is the site I'm working on : http://www.indodeco.ro (http://www.indodeco.ro/boxes.html)
This is the Lightbox2 gallery css code:



*
{
border: 0;
margin: 0;
padding: 0;
}


#page {
position: relative;
width: 550px;
}


#images {
float: left;
width: 550px;
}

#details {
color: #FFC;
}

.gallery {
width: 560px;
cursor: default;
list-style: none;
margin-left: 40px;
}

.gallery img {
background: #fff;
border-color: #aaa #ccc #ddd #bbb;
border-style: 20px outset grey;
border-width: 1px;
color: inherit;
padding: 2px;
vertical-align: top;
width: 100px;
height: 100px;
}

.gallery li {
background: #eee;
border-color: #ddd #bbb #aaa #ccc;
border-style:outset;
border-width: 10px;
color: #000;
font-weight:bold;
display: inline;
float: left;
margin: 15px 10px 15px 10px;
padding: 10px;
position: relative;
}

.gallery li ul {
border:none;
color:#000;
font-weight:bold;
font-size: 11px;

}


And fthis is my css site layout :



body {
margin-bottom: 0;
font-family: Verdana;
font-size: 10px;
color:#FFC;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
background:url(../images/bgd.gif) repeat;
margin: 0 auto;
padding: 0;
height: 100%;
}

#header {
margin: 0 auto;
width: 775px;
height: 363px;
}

#wrapper {
margin: 0 auto;
width: 775px;
height: 750px;
background: url(../images/bgd.jpg);
}

#wrapperR {
float: right;
width: 595px;
height: 750px;
background: url(../images/bgd.jpg);
}

#left_content {
float: left;
width: 180px;
height: 100%;
background-color:#000;
}

.p1 {
padding-top: 30px;
text-align:left;
}

.p2 {
padding-top: 30px;
}

#sidebar {
margin: 100px 0 0 10px;
width: 154px;
height: 560px;
}

#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}

#sidebar ul li {
padding: 3px 0 3px 0;
}

#sidebar ul li a {
font-size:12px;
font-family:"Times New Roman", Times, serif;
font-weight:bold;
color:#CCC;
text-decoration:none;
}

#sidebar ul li a:hover {
font-size:12px;
font-family:"Times New Roman", Times, serif;
font-weight:bold;
color:#600;
text-decoration:none;
}

h1 {
margin: 10px ;
Width: 160px;
height: 39px;
font-family: Bebas;
font-size:17px;
color: #708f04;
text-align:center;
background-color: black;
}

.a {
margin: 10px ;
Width: 266px;
height: 45px;
font-size: 8px;
color:black;
background: url(../images/instrumente.jpg) no-repeat;
}

#footer {
margin: 0 auto;
width: 775px;
height: 53px;
text-align: center;
background:url(../images/footer.gif) no-repeat;
}


Thank you guys, I really appreciated.

BLiZZaRD
03-18-2010, 06:53 PM
I suggest you not worry about coding for IE6. It is 2.5 versions outdated, and can't handle a ton of things that we (as designers/developers) need to accomplish.

The reach for IE6 is now below 20%, and like IE5.* it isn't worth the bother.