Selector help - avoiding double borders

This forum is for all Flare issues related to styles, stylesheets and XML.
Post Reply
oceanclub
Sr. Propeller Head
Posts: 277
Joined: Thu Oct 10, 2013 4:45 am
Location: Dublin

Selector help - avoiding double borders

Post by oceanclub »

Our Flare files - due to some being autogenerated from Markdown - may contain the following tags for code blocks:

<pre>

or

<code>

or
<pre><code>

The styles we use are:

Code: Select all

	font-size: 10pt;
	font-family: 'Consolas';
	mc-language: none;
	mc-hyphenate: never;
	border: 0.25px solid black; 
	display: block;
	background-color: #E6E6E6;
	padding-left: 0.18cm;
	padding-right: 0.18cm;
Unfortunately I can't figure out how to specify selectors in my CSS so that the border is not applied twice in the <pre><code> situation. Is there a :not selector that might work here?

Paul
ChoccieMuffin
Senior Propellus Maximus
Posts: 2630
Joined: Wed Apr 14, 2010 8:01 am
Location: Surrey, UK

Re: Selector help - avoiding double borders

Post by ChoccieMuffin »

You'll have to try it (in the middle of stuff in Flare so can't give it a go myself) but if you add the following to your stylesheet BELOW your pre and code style definitions, that should do the trick.

What it's doing is saying that anything styled as <code> that appears inside a <pre> doesn't have a border. (Depending on how your stuff is put together, you might find you need to use "pre > code" in the first line.)

Code: Select all

pre code 
{
border: none; 
}
Take a look at this page https://www.w3schools.com/cssref/css_selectors.asp which explains how the various selectors work.
Started as a newbie with Flare 6.1, now using Flare 2023.
Report bugs at http://www.madcapsoftware.com/bugs/submit.aspx.
Request features at https://www.madcapsoftware.com/feedback ... quest.aspx
oceanclub
Sr. Propeller Head
Posts: 277
Joined: Thu Oct 10, 2013 4:45 am
Location: Dublin

Re: Selector help - avoiding double borders

Post by oceanclub »

ChoccieMuffin wrote:You'll have to try it (in the middle of stuff in Flare so can't give it a go myself) but if you add the following to your stylesheet BELOW your pre and code style definitions, that should do the trick.

What it's doing is saying that anything styled as <code> that appears inside a <pre> doesn't have a border. (Depending on how your stuff is put together, you might find you need to use "pre > code" in the first line.)

Code: Select all

pre code 
{
border: none; 
}
Take a look at this page https://www.w3schools.com/cssref/css_selectors.asp which explains how the various selectors work.
Ah, thanks!

P.
Post Reply