Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Dec 2012
    Thanked 0 Times in 0 Posts

    Two types of links in a single template (Joomla!)

    Hello Everyone,

    I am trying to modify the Atomic template of Joomla. So what I want is to have the links of article/blog titles to have a black text with yellow background, while the rest of the links are just plain black.

    All the links in my template uses the parameter below:

    a:focus, a:hover {color:#fff;text-decoration:none;}
    a {color:#121212;text-decoration:none;background-color:#ffc21f;

    The problem with this code is that it makes every link in the page to have a yellow background.

    Normally, I'll just make a separate class for the blog title and insert that into the <a> tags like <a class="blog-link"...></a>, but sadly the codes for the titles are generated by Joomla and I can't seem to find them. In addition, it kind of defeat the purpose of using a content management system like Joomla if I were to manually code the <a> tags every time a blog is published.

    So, what do you recommend I do?

  2. #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Thanked 1,874 Times in 1,858 Posts
    Hello redstep,
    Would using the id or class of the element that contains your link be specific enough? If all the links will be contained in <article> you may target only those links by writing your CSS like this -
    article a:focus, article a:hover {color:#fff;text-decoration:none;}
    article a {color:#121212;text-decoration:none;background-color:#ffc21f;
    See about specificity here.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use a DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts