How to calculate the width of floated images in an article on a website?
Currently I resize the images in articles using style='width:...%', and it's pretty good if we're talking about common pagewidths (500-800px). But if we have an extra wide layout (it might be a fluid one), then this method isn't so good.
If we have an extra wide page, the images get bigger and need more vertical space, while the the text of the article consists of fewer lines so the text takes up less vertical space. This leads to an ugly layout of the article.
What method should I use to calculate the widths?
You can make use of the "max-width" and/or "max-height" css properties so the images are kept in reasonable size while keeping the ratio intact (setting both will NOT change the ratio). They are used like the "width" and "height" css styles.
Moreover, you can still set the width explicitly (in percentage or absolute) and the max-height/width will still take precedence if needed