1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum is for release discussion only. Discussions that do not relate specifically to the resource release should be discussed in another, more appropriate forum.
    Dismiss Notice
  3. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Remove the underline on hover from the footer links

Discussion in 'Template Modifications [Archive]' started by Brogan, Dec 7, 2010.

  1. Brogan

    Brogan XenForo Moderator Staff Member

    Someone asked how to remove the underline on hover from the footer links so here are some simple edits to achieve that.

    Again, add all custom css to EXTRA.css.


    To remove the underline from the copyright text add this:
    Code:
    #copyright .concealed:hover {
    text-decoration: none !important;
    }

    To remove the underline from Contact Us, Home & Top add this:
    HTML:
    .footerLinks a[href]:hover {
    text-decoration: none;
    }

    To remove the underline from Terms and Rules add this:
    HTML:
    #legal a[href]:hover {
    text-decoration: none;
    }

    To remove the underline from the Style Chooser and Language Chooser add this:
    HTML:
    .footer .choosers a[href]:hover {
    text-decoration: none;
    }
     
    Brian Chance, ArnyVee and Peggy like this.
  2. Peggy

    Peggy Well-Known Member

    Unfortunately this doesn't seem to work in the Flexile theme, for whatever reason.:confused:
     
  3. brendanc

    brendanc Active Member

    If you have Firebug installed, use the element inspector to find what CSS is overriding it. It'll tell you what file, line number, etc. If the css is crossed out, that means it has been overridden by something else.
     
  4. Peggy

    Peggy Well-Known Member

    Firebug confuses the beejeebers out of me. :(
     
    DaKat likes this.
  5. Brogan

    Brogan XenForo Moderator Staff Member

    Updated with code to remove the underline on hover for the copyright text which has reappeared with Beta 5.
     
  6. ArnyVee

    ArnyVee Well-Known Member

    Very cool, thanks Paul! :D
     
  7. Peggy

    Peggy Well-Known Member

    I wonder what you would add to this code to get these links to change color on hover, rather than underline?
     
  8. Brogan

    Brogan XenForo Moderator Staff Member

    Just update the code to add e.g. color: #cc0000 !important; before the closing }

    Like this:
    Code:
    #copyright .concealed:hover {
    text-decoration: none !important;
    color: #cc0000 !important;
    }
    
     
  9. Peggy

    Peggy Well-Known Member

    ahha! Thanks again, worked like a charm. :)
     
  10. bogus

    bogus Guest

    Good evening.
    I wanted to add a white background to the copyright and Terms Line, but i cant get it working.
    What i´ve done is

    Code:
    #copyright  {
    background: @contentBackground;
    }
    Unbenannt.jpg
    I just get is the Copyright Part white
     
  11. Brogan

    Brogan XenForo Moderator Staff Member

    Edit the .footerLegal .pageContent css to add a background-color: #FFFFFF;
    You will need to reduce the padding though otherwise it will give you a large white block.

    Try this:
    Code:
    .footerLegal .pageContent {
        background-color: #FFFFFF;
        font-size: 11px;
        overflow: hidden;
        padding: 5px 0;
        text-align: center;
    }
     
  12. bogus

    bogus Guest

    Thank you. Thats it.
    Could you also help to get the Copyright and Terms Text a bit away from the Border?
    Like in the example (green arrows)

    Unbenannt.jpg
     
  13. Brogan

    Brogan XenForo Moderator Staff Member

    Add some margin to the following classes:

    Code:
    #copyright {
        color: #646464;
        float: left;
        margin-left: 10px;
    }
    Code:
    #legal li {
        float: left;
        margin-left: 10px;
        margin-right: 10px;
    }
     
  14. bogus

    bogus Guest

    Great. Thanks a lot Brogan
     
  15. DaKat

    DaKat Well-Known Member

    Anyone know how I can include my own site copyright information (centered) in the footer field too?
     
  16. Brogan

    Brogan XenForo Moderator Staff Member

    Open the footer template and look for this just below the footerLinks section: <span class="helper"></span>

    Then insert your content in that span, for example:
    <span class="helper"><div style="text-align: center">Copyright My Site</div></span>

    Obviously you will want to style it accordingly, that's just to get you started on where to add it to the template.
     
  17. DaKat

    DaKat Well-Known Member

    Got it - thanks Brogan!
     

Share This Page