I sometimes use images in topics that are placed in the text line, such as small buttons or icons. For a neater view in the output, I’d like to specify a maximum height of 16px for these images (the width can vary).
I’ve used the Stylesheet Editor to create a new img style (with the default medium) and set a max-height of 16px. If I apply this style to an image, it’s resized correctly in the HTML output. However, the image width does not scale properly in the PDF output, which causes the image to appear distorted as a result.
Example: an image is 22x22px. I apply the new style. In the HTML output, the image is resized correctly to 16x16px. In the PDF output, the height of the image is 16px, but the width remains 22px.
How do I make sure the img style sets the maximum image height to 16px but keeps the original image dimensions? Does this require any additional configuration or is the problem caused elsewhere? Thanks!
Resize images with styles
-
- Senior Propellus Maximus
- Posts: 3669
- Joined: Thu Feb 02, 2006 9:57 am
- Location: Pittsford, NY
Re: Resize images with styles
I’m pretty sure that all you need to do is to add the max-width attribute, too, set to auto.
Or, you might need to use height and width, not max-height and max-width. I’m going on memory at the moment.
Code: Select all
img.YourImage
{
max-height: 16px;
max-width: auto;
}
Nita
RETIRED, but still fond of all the Flare friends I've made. See you around now and then!
RETIRED, but still fond of all the Flare friends I've made. See you around now and then!
Re: Resize images with styles
Thank you, such an easy solution and it works