Oxygen XML Forum

Posted: **Mon Mar 13, 2017 5:47 pm**

Hi.

I use the "abbreviated-form" in order to create a list of glossary. I would however like the "abbreviated-form" not to render as a link but rather as plain text. In which css-file can I change this?

I'm guessing there is a css line somewhere stating that "abbreviated-form" should inherit from "<a href"">".

Regards
Kristian

Posted: **Tue Mar 14, 2017 7:05 pm**

Hello,

You can contribute your own CSS file that overrides the default style rules following this procedure: https://www.oxygenxml.com/doc/versions/ ... n-css.html.

Actually, the abbreviated form term is generated inside an a element. For example:

Code: Select all


<a href="antilock.html" title="Anti-lock Braking System (ABS)">

    <dfn class="term abbreviated-form">Anti-lock Braking System (ABS)</dfn>

</a>

You can use the following CSS snippet as a starting point:

Code: Select all


.abbreviated-form,

.abbreviated-form:link,

.abbreviated-form:visited,

.abbreviated-form:hover,

.abbreviated-form:active

{

    font-style: normal;

    text-decoration: none;

    cursor: default;

    color:#000000;

}

Regards,
Alin

Posted: **Wed Mar 15, 2017 10:17 am**

This kind of works. But since the

Code: Select all

<dfn class="term abbreviated-form">Anti-lock Braking System (ABS)</dfn>

is inside the <a>-element I will still get a link behaviour since the styling is also set on the anchor element (in this case <a href"">). Is there any way of changing an element with the condition that it should only change when containing a certain class?
I have searched the internet for this but without results.

Thankyou.

Posted: **Wed Mar 15, 2017 6:26 pm**

Hi,

I understand that you want a way to match an element that has a certain child element (in your case a <a> element that contains a <dfn> element with the .abbreviated-form class). As far as I know there is no such thing as a parent selector in CSS. You can have a look here: https://www.w3.org/TR/css3-selectors/#selectors

You can try a JavaScript approach to this problem and remove the wrapping <a> element in this case. You can contribute a custom JavaScript code to the WebHelp transformation as follows:

For WebHelp Responsive: https://www.oxygenxml.com/doc/versions/ ... -html.html
For WebHelp Classic: https://www.oxygenxml.com/doc/versions/ ... hing2.html

Oxygen XML Forum

Remove link for abbreviated-form

Remove link for abbreviated-form

Re: Remove link for abbreviated-form

Re: Remove link for abbreviated-form

Re: Remove link for abbreviated-form