I've been so busy researching and writing content I haven't had time to keep up with the latest technology. I just discovered "Responsive Web Design" and "Flexible Images," and I still need to convert my database queries to PDO and maybe convert my web pages to HTML5. It sounds a little overwhelming.
The good news is I just discovered the CSS image style max-width: 100%. It's so simple and useful it blew me away. But there's one problem.
My code specifies the image's size: <img src="whatever" width="500" height="400" alt="Something">
If I apply the style (max-width: 100%) and put the image in a div measuring 100pixels wide, the image correctly scales down to a width of 100 pixels, but the height remains stuck at 400pixels. How do I fix that?
Conversely, I should ask if it's necessary to specify the width and height in the code in the first place, since it works fine without it. As I recall, the only problem I've ever had removing it is that my pages won't validate.
And since I'm thinking of converting to HTML5, does it require me to specify an image's width and height?