G'day
Wayne Godfrey wrote:
Is it possible using CSS to constrain the image sizes by creating
two or three classes, whereby the image width becomes fixed and the
height constrains accordingly, using percentages, ems or ???
If you don't specify a height on the image, but do specify a
width (be that in css or in the html), the height should adjust
automatically (once the browser has fetched the image and knows
its dimensions).
Quick css example:
.ProductLink img { width: 100px; }
.ProductLink:hover img { width: 200px; }
Or better still, set it on the container, e.g.
.Products a img { width: 100px; }
.Products a:hover img { width: 200px; }
AFAIK, the only problem with not specifying height is that the
browser won't know how much space to reserve for the image in its
layout. It will then either adjust things as the page loads or
delay displaying it until the images are loaded. Could be a
problem if there's a lot of them, especially on dial-up.
If the image is to be replaced on hover, you'll probably need
javascript (someone correct me if it can be done with CSS)
HTH
--
Bert Doorn, Better Web Design
http://www.betterwebdesign.com.au/
Fast-loading, user-friendly websites
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
