1. 

   VL Branko
   

   offline

   Member

   On this test page http://shyamasundaradasa.com/jyotish/temp/test_delete.html

   I use the "fancy-quote-dark" in the middle of the page. It is customized to match the general color scheme and is gold (ish) on a dark blue background, as opposed to the original white on black. Because of the dark background colors if the quote happens to have a link in it, it merges into the background and is hard to see.

   I tried to make a custom class of links but for some reason it is not working.

   a.fancy-quote-dark:link {
   color: white;
   text-decoration: none;
   }

   a.fancy-quote-dark:visited {
   color: white;
   text-decoration: none
   }

   a.fancy-quote-dark:hover {
   color: #6082BF;
   text-decoration: none;
   }

   a.fancy-quote-dark:active {
   color: red;
   text-decoration: none

   ___________

   These colors are just for playing around with and I would tweak them but before I can do that I have to get the links to work.

   I basically just used a set of working links for a different class and applied them to "fancy-quote-dark" but they don't work.

   What am I doing wrong?

   Posted 9 years ago
2. 

   Al Sparber
   

   offline

   PVII Team

   a.fancy-quote-dark:link {
   color: white;
   text-decoration: none;
   }

   The above is meaningless unless you assign the fancy quote dark class to the actual link. You want a descendant selector:

   .fancy-quote-dark a {
   color: white;
   text-decoration: none;
   }

   Posted 9 years ago
3. 

   VL Branko
   

   offline

   Member

   a.fancy-quote-dark:link {<br />
   color: white;<br />
   text-decoration: none;<br />
   }
   The above is meaningless unless you assign the fancy quote dark class to the actual link. You want a descendant selector:
   .fancy-quote-dark a {<br />
   color: white;<br />
   text-decoration: none;<br />
   }

   Thanks Al, but for my edification, as I am learning and with a long way to go, what is a "descendant selector?"

   Posted 9 years ago
4. 

   VL Branko
   

   offline

   Member

   I just did a search for that term and found a lot of links, I will look through them.

   Posted 9 years ago
5. 

   VL Branko
   

   offline

   Member

   a.fancy-quote-dark:link {<br />
   color: white;<br />
   text-decoration: none;<br />
   }
   The above is meaningless unless you assign the fancy quote dark class to the actual link. You want a descendant selector:
   .fancy-quote-dark a {<br />
   color: white;<br />
   text-decoration: none;<br />
   }

   I wasn't able to find that much on the net about this specific topic except for this http://tinyurl.com/qy3vscb which gives enough info to understand what is going on.

   I think the problem I had was exacerbated by the fact that "a.fancy-quote-dark:link {
   color: white;
   text-decoration: none;
   }"

   came up with same name as "fancy-quote-dark" class when I wanted to apply the style or in some other way it was not easy to identify in DW when I right clicked and accessed the available styles. But when I slightly altered the name to "fancy-quote-dark-links" I could see it and apply it to the links and it worked.

   However, having said that I see that using a descendant selector would be better because automatically all links in "fancy-quotes-dark" would have those link attributes without my having to specifically apply them to the links in that div.

   Therefore I will use descendant selectors which are more efficient as I see you have done in various places in Affinity for example in the footer.

   Posted 9 years ago

RSS feed for this topic

Reply

You must log in to post.