Page 1 of 1
Inline image height
Posted: Tue Jun 01, 2021 6:13 am
by MicTie
Using OxygenXML23.1 and the DitaMap WebHelp Responsive Transformation.
Besides images in various sizes, my project contains hundreds of inline images (mostly icons and buttons) which are specified in dita-topics like this
Code: Select all
<image href="../../Common/images/FREQ.png" height="18px" align="center" id="image_52" alt="WS"/>
The transformation 'overwrites' the height setting via 'wh-responsive-image.css:4' to
Code: Select all
.image {
max-width: 100%;
height: auto;
background-repeat: no-repeat;
}
Besides changing the original 'wh-responsive-image.css' in the Dita-Plugin, is there a way to 'unset' this 'height:auto' so that the originally set height becomes valid again?
Thanks for your help!
Re: Inline image height
Posted: Wed Jun 02, 2021 12:38 pm
by Costin
Hi,
Thank you for the feedback your provided!
I've just logged it in our internal improvements system, so that our developers will analyze it and see if there is something we could implement to improve this behavior.
Meanwhile, I suggest you should avoid modifying any of the plugin's source files directly, because this could conflict with files from a newer version and generate issues when you update the software at a later time.
We do not have a general rule to unset the height property, but you could use your own customization CSS to match specific elements and set a custom height value for them.
For your specific example, you could use something like:
Code: Select all
.image[height="18"] {
height: 18px;
}
You can find more details on how you could use your internet browser's CSS inspector to identify the selectors you should use in your CSS customization and how the custom CSS could be used in a scenario, in
this section from the WebHelp User-Guide.
Regards,
Costin
Re: Inline image height
Posted: Wed Jun 02, 2021 12:50 pm
by MicTie
Thank you!
Your solution works fine for me!
Re: Inline image height
Posted: Tue Mar 15, 2022 3:29 pm
by Costin
Hello,
I just wanted to update this thread and let you know that this issue has been resolved in the latest maintenance build of Oxygen XML WebHelp 24.1,
2022030500 (released March 10th, 2021).
You can download it from our web site:
http://www.oxygenxml.com/download.html
Best Regards,
Costin
Re: Inline image height
Posted: Fri May 03, 2024 5:39 pm
by IanMayo
Hello, it looks like this issue has returned.
I'm using Oxygen WebHelp in XML Author 26.1.
I set height and width attributes for my images, but the browser still renders them using `height: auto` - which puts them at their native size.
In this page, the row of images near the top of the page all have a `height` attribute of `177` in DITA, which gets propagated to `height` in the published HTML:
https://deepbluecltd.github.io/Fi3ldMan ... chors.html
But, when rendered they are different sizes. I believe this is because of the `height: auto` in `topic.css`.
I could fix this by removing the attribute from `topic.css` but I'd like to leave the webhelp template unchanged.
Re: Inline image height
Posted: Thu May 09, 2024 10:48 am
by julien_lacour
Hello Ian,
You're right, the problem has returned. I added an issue on our side to fix it again.
I will notify this thread once a fix will be available. Thank you for reporting the issue.
Regards,
Julien
Re: Inline image height
Posted: Thu May 09, 2024 1:44 pm
by IanMayo
Thanks for that Julien.
Note: a workaround is to remove the
element from from
Code: Select all
.image,.image:not(img[height]){height:auto}
in
Code: Select all
frameworks/dita/DITA-OT/plugins/com.oxygenxml.webhelp.responsive/oxygen-webhelp/app/topic.css
Re: Inline image height
Posted: Thu Aug 15, 2024 11:00 am
by IanMayo
Hello Julien,
did a fix for this issue get included in the 26.1 maintenance release?
Regards,
Ian
Re: Inline image height
Posted: Fri Aug 16, 2024 9:42 am
by julien_lacour
Hello Ian,
The fix for this issue is not in Oxygen 26.1 Maintenance Build, it is still under analysis.
When it will be available this thread will be notified.
Regards,
Julien