Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Css for Div not working

  • This topic is empty.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #179707
    satrap
    Participant

    I have this code in my custom functions plugin so I can display a text ad after my single-posts.

    And in order to style it, I created a div.

    Here is the code:

    add_action( 'genesis_entry_footer', 'insert_custom_post_bottom_ad' );
    
    function insert_custom_post_bottom_ad() {
    ?>
    
    <div class="custom-ad">
    
    <?php if ( is_single() ) : ?>
    
    If you want more information, then blah blah blah....
    
    <p style="text-align: center"><strong><a href="http://example.com">Click to Learn More</a></strong></p>
    
    <?php endif; // is_single() ?>
    
    </div>
    
    <?php
    }

    Then I put this CSS in my style.css file:

    .custom-ad {
        border-left: 3px solid #0099ad;
        border-right: 3px solid #0099ad;
        font-size: 2rem;
        padding-left: 10px;
        padding-top: 5px;
    }

    But, it doesn’t work. The funny thing is that when I created the code using the firebug addon (adding the new rule and properties) the css code was working as it should. But when I put it in my style sheet, it doesn’t show. The browser/firebug addon, doesn’t even acknowledge it.

    The other thing is that I tried to add the css inline and it did work. But I am puzzled as to why it’s not working in my style.css file.

    Any help would be appreciated.

    Thanks in advance.

    #179714
    Krish1980
    Participant

    I do not understand php but…..

    shouldn’t you be giving the div a class of ‘custom-ad’?

    Perhaps you should try

    `

    <div class=”custom-ad”>

    ……………………

    </div>

    `

    #179716
    satrap
    Participant

    You are correct. Somehow while copy pasting the code, I didn’t include that part (will fix it now).

    So, yes the original code has the

    <div class="custom-ad">
    which is why it is kind of confusing to me as to why its not working. Thanks.

    #179717
    Krish1980
    Participant

    Do you have a link that you could share? A link will be useful to examine what’s happening and why the styles aren’t being applied.

    #179723
    satrap
    Participant

    Sure, I am sorry, I should have included the link. I apologize.

    Here it is…

    Since what I am talking about only applies to single posts, the link above isn’t the homepage. It leads to a post page where you can see this in action.

    By the way, the section I am talking about is located at the bottom of the post right before the Adsense link unit, and is currently wrapped in a ” tag.

    #179726
    wahhabb
    Participant

    When I look at style.css, I don’t see the .custom-ad rule. Either you forgot to upload it, or for some other reason it hasn’t been included.

    #179730
    rewindme
    Participant

    /* Recent Post widget on the homepage
    ——————————————— */
    .widget_recent_entries {
    line-height: 1.785;

    // missing “}” here….

    /* Custom text ads (CPA Offers, etc)
    ——————————————— */
    .custom-ad {
    border-left: 3px solid #0099ad;
    border-right: 3px solid #0099ad;
    font-size: 2rem;
    padding-left: 10px;
    padding-top: 5px;
    }

    #179908
    satrap
    Participant

    @wahhabb
    That is what I meant when I said the browser or even firebug don’t even acknowledge it. The rule is in my style sheet, but for some reason its not showing when inspected by firebug.

    That is why I am confused as to why its not working when I do have the code in my style sheet.


    @rewindme

    Thanks for the catch. That fixed the issue.

    In case anyone else reads this later, that missing “}” for the .widget_recent_entries was causing the css for .custom-ad to not work.

    Thanks very much rewindme and wahhabb for taking time to help out. Really appreciate your help.

    #179997
    ThatCat
    Participant

    The community appreciated if you edit the subject of the post and add “SOLVED” in the title, will help when someone else has similar problems :)
    And it will prevent future posts on this topic.

Viewing 9 posts - 1 through 9 (of 9 total)
  • The forum ‘CSS’ is closed to new topics and replies.