Highlight paragraph without changing styles in it

This forum is for all Flare issues related to styles, stylesheets and XML.

Highlight paragraph without changing styles in it

Postby Dave1975 on Wed Oct 02, 2019 12:33 am

Hi there

I'm trying to find out how I can apply a yellow background to a paragraph that holds already a number of styles, without changing those styles. The purpose is to indicate items that still need rework. Example below shows a P.body that will eventually be replaced by an image and the p.caption that goes with it.

<p class="Body" >Add drawing CX500 Duplex + most common pre/post device</p>
<p class="Caption_next" >X + CX500 Duplex + Y</p>

I experimented with divs, spans and generic styles and getting the text to be highlighted is easy, but I always end up loosing the style p.captionnext which gets replaced by a p.body.

Is there a way to select a chunk of text, paragraphs etc.. and then apply a CSS element "highlight" to it without touching the existing styles?

I know I could simply us local formatting but I rather stick to the CSS.

any thoughts are appreciated.

thanks

David
Dave1975
Propeller Head
 
Posts: 42
Joined: Thu Sep 15, 2016 4:25 am
Location: Belgium

Re: Highlight paragraph without changing styles in it

Postby ChoccieMuffin on Wed Oct 02, 2019 3:13 am

Have you tried creating a div that only has the background highlight colour and nothing else, and then putting that div around stuff you want to highlight? You should end up with:

<div class=highlight">
<p class="Body" >Add drawing CX500 Duplex + most common pre/post device</p>
<p class="Caption_next" >X + CX500 Duplex + Y</p>
</div>
Started as a newbie with Flare 6.1, now using Flare 2019r1.
Report bugs at http://www.madcapsoftware.com/bugs/submit.aspx.
Request features at https://www.madcapsoftware.com/feedback ... quest.aspx
ChoccieMuffin
Senior Propellus Maximus
 
Posts: 2117
Joined: Wed Apr 14, 2010 8:01 am
Location: Surrey, UK

Re: Highlight paragraph without changing styles in it

Postby Dave1975 on Wed Oct 02, 2019 5:15 am

I was going to say that I tried that and it didn't work but luckily I gave it another try :lol:

CSS:
div.highlight
{
background-color: #ffff00;
}

This time it worked. Not sure what went wrong earlier but it's fine now.

Thanks!

regards

David
Dave1975
Propeller Head
 
Posts: 42
Joined: Thu Sep 15, 2016 4:25 am
Location: Belgium

Re: Highlight paragraph without changing styles in it

Postby ChoccieMuffin on Wed Oct 02, 2019 7:32 am

You might have just shoved it in a div, rather than your div.highlight.

Anyway, it's working now, so that's got to be a good thing on a Wednesday. :)
Started as a newbie with Flare 6.1, now using Flare 2019r1.
Report bugs at http://www.madcapsoftware.com/bugs/submit.aspx.
Request features at https://www.madcapsoftware.com/feedback ... quest.aspx
ChoccieMuffin
Senior Propellus Maximus
 
Posts: 2117
Joined: Wed Apr 14, 2010 8:01 am
Location: Surrey, UK

Re: Highlight paragraph without changing styles in it

Postby doloremipsum on Mon Oct 07, 2019 1:26 pm

For future reference: the Flare UI won't do it, but if you jump over to the text editor you absolutely can apply a second style class to an element without affecting the first. Just find the class="caption_next" bit and add the other class, for class="caption_next body".
doloremipsum
Propeller Head
 
Posts: 19
Joined: Mon Aug 26, 2019 2:11 pm

Re: Highlight paragraph without changing styles in it

Postby ChrisBradley on Wed Oct 09, 2019 10:55 am

You can also add a generic class to your stylesheet and be able to highlight portions of a paragraph or individual items in a list:

CSS:
.highlight
{
background-color: #ffff00;
}

You can also select the generic style for DIV tags.
Madcap Advanced Developer
ChrisBradley
Propeller Head
 
Posts: 53
Joined: Thu Dec 13, 2007 12:24 pm


Return to Styles, Stylesheets and XML

Who is online

Users browsing this forum: No registered users and 2 guests