Image scaling in CSS

Ok, I've validated the majority of the site and fixed the broken code! I've also declared the dtd file and all seems to be rendering fine now.

The image scaling down is now working in all browsers.

However, for smaller images, they are being made larger than their native res for some reason? Here is a live example:
http://flyawaysimulation.com/modules.php?name=My_eGallery&do=showpic&pid=6921

The original is (490px × 318px) but it's being scaled to (646px × 419px).

Can you shed any light? Your help has been great

 

You just need to add a "px" after the 490 when you generate the attribute and that should fix it. I have absolutely no idea where the 646px value was coming from.

Let me introduce you to the next validator on the list After I spotted the missing px I ran it to see if there were any other issues and you just about got past this one on the first try.

http://jigsaw.w3.org/css-validator/...rofile=css21&usermedium=all&warning=1&lang=en

I'm linking you to it so that you and anyone else following this thread know it's there. I think you will be running into a lot fewer "mystery" problems after this.

That's a great site, btw.

 

Adding the "px" worked like a charm! Thank you very much for your help. I'm going to move the inline styles onto the style sheet now and call the div and images by class.

 

After validating the CSS, it came up with the error "Property text-shadow doesn't exist in CSS level 2.1 but exists in [css2, css3]"

How do I specify my version of CSS?

 

You know, I never saw this property actually work before today. It's blacked out at w3schools even though they show it as being in the 2.0 spec as well.

w3 discusses it only in terms of css3. http://www.w3.org/Style/Examples/007/text-shadow
This page also renders incorrectly in all browsers I have but Safari, and fails their own validator. Chrome (also webkit-based) may show it as well, if Safari does.

To answer your question, I'm not aware of any way to specify the version for a CSS file. It appears that at least IE , FF, and the W3 validator are looking for strict compliance with the current version of the spec (2.1) in their parsing/validation.

It's awfully late here so I'm going to bed without researching why they appear to have deprecated and then reconsidered this feature.

Doing without it will provide you with formal validation (an academic pleasure, not a necessity) and consistency across browsers.

However if a large portion of your user base is in webkit browsers or you just like seeing the effect when you visit, leave it in. It's not really hurting anything.

My personal choice would be to do without it. I prefer the consistency, and I like to validate. As you've seen while fixing this site, sometimes when the code is a mess you don't know it until you're having some error so obscure you have to catch up on weeks, months, or years of minor errors to fix the current problem. Regular validation is a helpful tool. But it's usually not a requirement.

Seriously, the odds of this causing you other problems are almost nonexistent. If you like to see the shadows when you visit the site, leave them in there. You're aware of the issue so if it seems that it might be a factor in another problem you encounter, you can comment them out temporarily to troubleshoot. And not one single visitor/customer will probably ever care whether or not your site will pass CSS validation.

It's kind of annoying to go through all that and still have that red message staring at you though, isn't it?

 

There's nothing wrong with leaving CSS "errors" if the "error" is simply that you're using some CSS 3 and validating with a CSS2.1 validator. If you can see the effect in whichever browsers can show that CSS3, then you've written it correctly. The same goes for vendor extensions such as -moz and -webkit... they show as "errors" but as with any error if you understand why it's being called an error, you as the developer can choose to leave it. HTML is another story : )

CSS3 is being drafted and approved in modules, instead of the whole shebang at once, so they've left the validator at CSS2.1 for now. For instance, we're still waiting for border-radius : ) That doesn't mean you can't use it (or, the vendor extensions for it), just be aware of where it fails, and don't rely on it for things like letting people read white text on a white background (like you can with text-shadow, since only Saffy, Opera and Konq work with it (forgot about Chrome, not sure)).

 

i am newbie , want to learning Css but it is difficult , thanhs for info