www.westernwebdesign.com.au/test/flora3.html
I have an image gallery with thumbnails and use js to enable them to
open a larger version in a box on the same page.
The problem is that some thumbnails - like the one shown - enlarge and
distort themselves instead of staying the size they actually are.
This only seems to happen with thumbnails that are taller than they are
wide. I have no idea why this is happening - there should be plenty of
room for them. I make them a max of 80px high
Is there anything in the CSS that is causing this?
Thanks
Lyn
<ul id="img">
<li><div><a href="caesia.jpg" onclick="return
Genie(this.href,400,533);"><img alt="Caesia micrantha" src="caesiath.jpg" />
</a></div><p><em>Caesia micrantha</em> - Pale Grass Lily</p>
</ul>
ul#img {
list-style:none;
font-size: .76em;
margin:0 0 0 2em;
padding:0;
float: left;
width: 90%;
}
ul#img li {
width: 105px;
height: 160px;
float: left;
margin: 0 0.5em 0.5em 0;
background-color:#dba;
}
ul#img li div {
height: 90px;
position:relative;
background-color:#dba;
}
ul#img li img {
display:block;
position:absolute;
bottom:0;
width: 100px;
}
ul#img li p {
margin: .25em;
color: #000;
}
ul#img li p span {
font-weight:bold;
display:block;
margin-top:1em;
}
ul#img:after {
display:block;
content: " ";
clear:left;
height:0;
}
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************