Peter von Kaehne wrote:
> I like my icon bar for looking at software categories, but am not
> conviced yet by its handling. If someone has an idea how to make it less
> jumpy I would be grateful.
Here is a little something I just worked out. I changed only the CSS,
not the HTML. It works on FF3 and IE7. One weird thing, though: On FF,
the icons expand upward; on IE, they expand downward. (But they're not
jumpy anymore.)
<html>
<head>
<title>Crosswire Fix</title>
<style>
ul.systems {
text-align:center;
height:80px;
}
systems li {
line-height:70px;
height:70px;
display:inline;
vertical-align:text-bottom;
}
systems a {
height:60px;
vertical-align:bottom;
}
systems a img {
border: 1px solid black;
width:40px;
border-width:0;
}
systems a:hover img {
width:40px;
height:60px;
}
</style>
<base href="http://crosswire.org"; />
</head>
<body>
<ul class="systems">
<li><a href="index.jsp?section=Linux"><img src="images/tux2.png"
alt="Linux software" title="Linux and Unix software"
style="border:0"></a></li>
<li><a href="index.jsp?section=Windows"><img src="images/windows.png"
alt="Windows software" title="Windows software" style="border:0"></a></li>
<li><a href="index.jsp?section=Mac"><img src="images/blueapple.png"
alt="Mac OSX software" title="MacOSX software" style="border:0"></a></li>
<li><a href="index.jsp?section=Java"><img src="images/duke.png"
alt="Java software" title="Java Software" style="border:0"></a></li>
<li><a href="index.jsp?section=Handhelds"><img
src="images/handhelds.png" alt="Handhelds and Mobile Phones"
title="Handhelds and Mobile Phones" style="border:0"></a></li>
<li><a href="index.jsp?section=Web"><img src="images/web.png" alt="Web
based software" title="Web based software" style="border:0"></a></li>
</ul>
</body>
</html>
_______________________________________________
sword-devel mailing list: sword-devel@crosswire.org
http://www.crosswire.org/mailman/listinfo/sword-devel
Instructions to unsubscribe/change your settings at above page
