Selector help - avoiding double borders

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

Selector help - avoiding double borders

Postby oceanclub on Wed Feb 12, 2020 3:16 am

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
User avatar
oceanclub
Sr. Propeller Head
 
Posts: 221
Joined: Thu Oct 10, 2013 4:45 am
Location: Dublin

Re: Selector help - avoiding double borders

Postby ChoccieMuffin on Wed Feb 12, 2020 6:25 am

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 2019r1 and 2020.
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: 2342
Joined: Wed Apr 14, 2010 8:01 am
Location: Surrey, UK

Re: Selector help - avoiding double borders

Postby oceanclub on Wed Feb 12, 2020 6:36 am

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.
User avatar
oceanclub
Sr. Propeller Head
 
Posts: 221
Joined: Thu Oct 10, 2013 4:45 am
Location: Dublin


Return to Styles, Stylesheets and XML

Who is online

Users browsing this forum: No registered users and 2 guests