0
Welcome Guest! Login
0 items Join Now

CSS override doesn't seem to work for "::after"

Last Post
Search Topic
    • arqui's Avatar
    • arqui
    • Newbie
    • Posts: 9
    • Thanks: 0

    CSS override doesn't seem to work for "::after"

    Posted 7 years 4 months ago
    • Hi guys,

      I've been deploying a website using RT-Hadron, and as per your documentation, I've created a custom css file to override some default css stylings. The problem is that in Roksprocket-strips module, there's a "+" in the "after" of the related class (.fp-roksprocket-strips .sprocket-strips-image-overlay:after) that I cannot change (from "+" to "++").

      The CSS that I'm using to override it contains the following code, although the file itself doesn't even get loaded when checking the website via F12:

      .fp-roksprocket-strips .sprocket-strips-image-container:hover .sprocket-strips-image-overlay:before, .fp-roksprocket-strips .sprocket-strips-image-container:hover .sprocket-strips-image-overlay:after {position:absolute;content:"++";font-size:3em;top:50%;left:50%;margin-top:-25px;margin-left:-25px;display:block;width:50px;height:50px;line-height:50px;border-radius:0;background:#e0e0e0;color:#282828;border:1px solid #e0e0e0;text-align:center;opacity:0;}



      The site url:
      goo.gl/vP80li

      Any help would be very appreciated.
    #1327544
    • David Goode's Avatar
    • David Goode
    • Preeminent Rocketeer
    • Posts: 17058
    • Thanks: 890
    • Web Designer and Host

    Re: CSS override doesn't seem to work for "::after"

    Posted 7 years 4 months ago
    • Hi there,

      First of all the custom css is being called as it shows in the head tags...

      <link rel="stylesheet" href="/templates/rt_hadron/css/rt_hadron-custom.css" type="text/css">

      When I open that in a new tab this all the content I can find...

      #rt-navigation-a .menu-block { float:left; width:100%; position:relative; }
#rt-navigation-a ul.gf-menu { clear:left; float:right; position:relative; right:50%; text-align:center; }
#rt-navigation-a ul.gf-menu > li { display:block; float:left; position:relative; left:50%; }
#rt-logo { margin: 25px auto 25px auto;}

      So either you haven't uploaded the changes or perhaps you have uploaded elsewhere.

      Hope this helps 8)

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
    #1327578
    • arqui's Avatar
    • arqui
    • Newbie
    • Posts: 9
    • Thanks: 0

    Re: CSS override doesn't seem to work for "::after"

    Posted 7 years 3 months ago
    • Hi David,

      According to Gantry documentation, if a template uses LESS, then, the code override should be placed in .../public_html/templates/rt_hadron/less

      Either way, as I'm not sure, I've also pasted the code to the directory you mentioned, but the results are the same. Can you help?
      Thanks.
    #1330027
    • David Goode's Avatar
    • David Goode
    • Preeminent Rocketeer
    • Posts: 17058
    • Thanks: 890
    • Web Designer and Host

    Re: CSS override doesn't seem to work for "::after"

    Posted 7 years 2 months ago
    • Hi Arqui,

      Apologies, this one slipped through the net. :blush:

      Do you still need help with this?
    • Last Edit: 7 years 2 months ago by David Goode. Reason: Typo

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
    #1333880

Time to create page: 0.050 seconds