• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

How To Apply These CSS Effects?

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › How To Apply These CSS Effects?

This topic is: resolved

Tagged: css, streamline theme

  • This topic has 4 replies, 2 voices, and was last updated 12 years, 6 months ago by daniel123.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • January 6, 2013 at 9:55 am #9930
    daniel123
    Member

    I found these great CSS effects to apply to my 125x125 advertise blocks. I messed around with the CSS classes and ids and just couldn't "link" it to the WP125 widget.

    Original CSS:

    /* -------------------Ads------------------*/
    div.bsap_125 a{width:125px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;float:left;line-height:100%;margin:0 4px 10px 0;}
    div.bsap_125 img{border:2px solid #ddd;clear:right;padding:5px;}
    div.bsap_125 a.adhere{color:#666;font-weight:bold;font-size:12px;border:2px solid #ccc;background:#e7e7e7;text-align:center;width:125px;height:125px;line-height:1000%;}
    div.bsap_125 a.adhere:hover{border:2px solid #999;background:#ddd;color:#333;}
    html>

    body div.bsap_125 a.adhere{width:123px;height:123px;}
    div.bsap_468 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
    div.bsap_468 img{border:0;clear:right;}
    div.bsap_468 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:468px;height:60px;line-height:480%;}
    div.bsap_468 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
    html>

    body div.bsap_728 a.adhere{width:726px;height:90px;}
    div.bsap_728 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
    div.bsap_728 img{border:0;clear:right;}
    div.bsap_728 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:128px;height:90px;line-height:730%;}
    div.bsap_728 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
    html>

    body div.bsap_336 a.adhere{width:334px;height:280px;}
    div.bsap_336 a{width:468px;display:block;font-size:11px;color:#888;font-family:verdana,sans-serif;text-align:center;text-decoration:none;overflow:hidden;line-height:100%;margin:0;}
    div.bsap_336 img{border:0;clear:right;}
    div.bsap_336 a.adhere{color:#666;font-weight:bold;font-size:12px;border:1px solid #ccc;background:#e7e7e7;text-align:center;width:336px;height:280px;line-height:2200%;}
    div.bsap_336 a.adhere:hover{border:1px solid #999;background:#ddd;color:#333;}
    html>

    body div.bsap_468 a.adhere{width:466px;height:58px;}
    .bsap a{text-shadow:1px 1px 1px #111!important;color:#eee!important;overflow:visible!important;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-o-transition:all .2s ease;border:0 none!important;-webkit-border-top-left-radius:80px;-webkit-border-bottom-right-radius:80px;-moz-border-radius-topleft:80px;-moz-border-radius-bottomright:80px;border-top-left-radius:80px;border-bottom-right-radius:80px;margin:0 10px 10px 0 !important;padding:7px!important;}
    .bsap a:hover{-webkit-border-top-left-radius:40px;-webkit-border-bottom-right-radius:40px;-moz-border-radius-topleft:40px;-moz-border-radius-bottomright:40px;border-top-left-radius:40px;border-bottom-right-radius:40px;}
    .bsap a img{border:0 none!important;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.5);-moz-box-shadow:0 0 8px rgba(0,0,0,0.5);box-shadow:0 0 8px rgba(0,0,0,0.5);padding:3px!important;}
    .bsap .even{margin-right:0!important;}
    .bsap .ad1{background:#e42b2b!important;}
    .bsap .ad2{background:#ff8400!important;}
    .bsap .ad3{background:#a800ff!important;}
    .bsap .ad4{background:#49a7f3!important;}
    .bsap .ad5{background:#41d05f!important;}
    .bsap .ad6{background:#B24700!important;}
    .bsap .ad7{background:#FFE500!important;}
    .bsap .ad8{background:#007D47!important;}
    .bsap .ad9{background:#330000!important;}
    .bsap .ad10{background:#990000!important;}
    .bsap .ad11{background:#f70000!important;}

    January 6, 2013 at 1:33 pm #9966
    daniel123
    Member

    Anyone?

    January 6, 2013 at 3:02 pm #9972
    AnitaC
    Keymaster

    You could use Firebug for Firebug and find the class id's that way to each one.


    Need help with customization or troubleshooting? Reach out to me.

    January 6, 2013 at 3:24 pm #9974
    daniel123
    Member

    Yes, I've already tried it and it doesn't work. Is it because it's a plugin or..?

    January 6, 2013 at 6:29 pm #9994
    daniel123
    Member

    Nevermind I figured it out.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘How To Apply These CSS Effects?’ is closed to new replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble