Trying to force this page to show the thumbnails at the same height. Thumbnails vary in width.
http://barbarawhiteperry.com/test.html
Thanks again!
Find this piece of code
Find this piece of code inside your elastislide.css:
.es-carousel ul li a img { display: block; border: none; max-height: 100%; max-width: 100%; }
and change it to
.es-carousel ul li a img { display: block; border: none; height: 53px; max-width: 100%; }
helldog2004 wrote: Find this
Find this piece of code inside your elastislide.css:
.es-carousel ul li a img { display: block; border: none; max-height: 100%; max-width: 100%; }
and change it to
.es-carousel ul li a img { display: block; border: none; height: 53px; max-width: 100%; }
Thanks! But it didn't work....
uhmm yes it does work, tested
uhmm yes it does work, tested it on your website...
You must have done something wrong, did you change the file online, or did you do it on computer.
If you did it on computer, did you re-uploaded the files via FTP.
If you re-uploaded the files to FTP, did you emptied your website host server cache?
Because I am 150% sure it works.
Tried it again and it worked,
Tried it again and it worked, but forced the widths, so the thumbnails are squished...?
Are you seeing it with landscape orientation thumbnails and consistent heights?
ofcourse the images are
ofcourse the images are squashed. if you want the images to look good then I suggest you to use images with the correct dimensions.
For example you want all the thumbnails to be 50px width and 50px height, then you should use images with dimensions which has width and height as same digit.
So using images with 10 x 10 is okay, using images with 65 x 65 is okay, because both sides are the same.
But if you are using 50px in width and 35px in height, then force the images to be 50px in height will ofcourse transform the image in something not so beautiful.
Hope this helped you.
Aspect ratio
If you want a set height and you want to maintain the aspect ration (the ratio of width to height), do not specify a width.
It would be more optimal to resize the images and save on the server. Browsers are not nearly as good as real image manipulation programs. For resizing, I'd advise GIMP or ImageMagick, as tests show that these are slightly superior to Photoshop for this purpose. I would also convert the thumbnails to gif since thumbnail reductions seldom benefit from jpg's continuous tones; the reduced palette will not be noticed and file sizes will be significantly reduced.
From the command line, in the current directory
convert *.jpg -thumbnail x90 -set filename:fname '%t_tn' +adjoin '%[filename:fname].gif'
As far as I'm concerned, ImageMagick belongs in every web developers toolbox. Before Photoshop, even.
cheers,
gary