MadCap Software Forums

Hi all,
In my topic I have an image which is needed for PDF and HTML5 output.
Later I´d like to work with one svg format only, later ...

At the moment the original image for the PDF output is an illustrator eps in portrait
For the HTML5 output I save this file as JPG image.

But for the HTML5 output I need this file in landscape. How can I do / rotate this?

I guess, with capture it does not work because capture rotates only objects on top of the image.
I´d tried this idea with the rotate attribute, but does not work.

<p MadCap:conditions="Generate_Output_Conditions.ScreenOnly">
<img src="../../Images/4_Images_BLD/L6000_BLD.jpg" alt="L6000 Block diagram" rotate="90" />
</p>

You want to use the CSS property transform with the value rotate(90deg) as described here:
https://www.w3schools.com/cssref/css3_pr_transform.asp

I can also dig up some PHP code that rotates images on the fly based on settings stored in a database. I used that for a photo viewer web app years back where I had image files that needed to be rotated left 90°, right 90°, 180°, or not at all.

Honestly, use the CSS approach and craft various styles that do what my code does. When I coded this CSS and browsers couldn't do this. Using the style transform is likely much faster and much easier to implement in static pages such as HTML5 help.

nice that helps me a lot, thanks

Does rotating images work in PDF output? I have a separate img class in my css to but it doesn't seem to be doing anything.

Thanks in advance.

Hi,
I´ve this div class below but I use it as a screen only conditions. So I guess at the moment I had problems
- rotating the image JPG file, works fine for HTML5 output
- rotating the EPS illustration for PDF output. Does not work.

I should check this as responsive svg image for both, but that svg issue needs a couple of time ....



div.ImageRotate90
{
transform: rotate(90deg);
}