|
Answer» I've had it to here with these friggin' pictures.
I've got three pictures I'm supposed to apply to a template, along with some text. I can get them to render fine, but not in IE. In IE they appear stretched, as if they are too long for their width. I didn't do this; in fact, I specified percentages of image size so that they'd be relatively scaled. What on earth is going on, here?
Here's my source code for this page:
Code: [Select]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"HTTP://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<***html xmlns="http://www.w3.org/1999/xhtml"***>
<head>
<title>House of T'Kabi</title>
<link rel="stylesheet" type="text/css" href="../../../../CSS/master.css" />
<***STYLE*** type="text/css">
<!--
body {
background-color: #CCCCCC;
}
img.floatleft {
float: left;
}
img.floatright {
float: right; }
div {
width: 100%;
border: 0px solid black;
-->
<***/style***>
</head>
<body>
<h1 class="center">Cavitt Bridge</h1>
<p>Cavitt Bridge</br />
Douglas County, Oregon<br />
37-10-06<br />
Built 1943<br />
Howe Truss</p>
<p>Located south of Glide on Little River Road.</p>
<p class="center"><img src="../images/cavitt_1.png" alt="Cavitt Bridge" width="75%" height="75%" /></p>
<p>Cavitt Bridge is an 82-foot bridge built in 1943 with round logs for the upper and lower chords. Floyd C. Frear, who designed the bridge, claimed that with proper maintenance the bridge would last a half century. It has already exceeded that estimate and still stands as testament to the tenacity of covered bridges. The bridge spans Little River where it is joined by Cavitt Creek. There are murals painted on the abutments that add touch of class to a favorite swimming spot for the residents. Robert Cavitt was a bachelor who settled on this tributary of Little River.<img src="../images/cavitt_2.png" alt="Cavitt Bridge" width="40%" height="40%" class="floatleft" /></p>
<img src="../images/cavitt_3.png" alt="Cavitt Bridge" height="40%" width="40%" />
</body>
</html>
I don't really have the asterisks... Is the page out on the web yet? Can you post the URL?I removed the height attrubute and it's working OK now. How, I have no freaking idea. :-? :-? :-?
EDIT: Maybe I can't use both height and width with percentages... :-?
Quote Maybe I can't use both height and width with percentages... :-?
There's nothing wrong, strictly speaking, with USING percentages - it just won't do what you want. The percentage refers to the containing element (the tag), not the image. The tag is expandable unless constrained by CSS is its own container. If you need to display an image at a particular percentage of its size, you can use javascript to set the height and width attributes, or better yet, PHP.
But you shouldn't really be using HTML to scale down images. It's ineffecient. If you want the image to be smaller, you should make it smaller, rather than cause people to download more than their browsers will actually be displaying. Trust me, I know what you mean. But I'm on a deadline ATM, a 4-day deadline, so I'm taking a few shortcuts... for now. When I get the site up I'll start resizing images, but that's a tall order in itself, and I got a long to-do list... But top priority for Maintinence Period I is to resize all seventy-something images to actual size. :-/You have a Linux box running, yes? It'll take about 20 seconds to produce images at exactly the size you need, using the convert program from the ImageMagick toolkit.
Here's a simple script called "resize" that I wrote and use. The 1024x1024 just makes those the maximum height and width. The images remain in proportion. Make sure you have a folder "done" within the folder where you run this script:
#!/bin/sh
#
# eg resize *.jpg
for file in "[email protected]"
do
convert "$file" -resize 1024x1024 "done/$file"
doneIf you have photo editing software, perhaps that came with a digital camera, see whether it has batch resizing CAPABILITY. The FinePix Viewer program that came with my camera has that capability. ALSO, the excellent freeware photo editor IrfanView appears to have that feature. I haven't actually used IrfanView but I see batch processing listed on What is IrfanView?. Keep in mind it is FREEWARE (for non-commercial use).Soybean, "Freeware" doesn't imply that it can't be used for commercial purposes...?Right, it doesn't necessarily mean that. But, IrFanView specifically says that on their site. Here's the exact wording on one page: "IrfanView is a very fast, small, compact and innovative FREEWARE (for non-commercial use) graphic viewer for Windows 9x/ME/NT/2000/XP/2003."
Aha. Thankee!
|
