How To Apply These CSS Effects?

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

This topic is: resolved

This topic contains 4 replies, has 2 voices, and was last updated by  daniel123 1 year, 8 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #9930

    daniel123
    Participant
    Post count: 52

    I found these great CSS effects to apply to my 125×125 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;}

    • This topic was modified 1 year, 8 months ago by  daniel123.
    • This topic was modified 1 year, 8 months ago by  daniel123.
    • This topic was modified 1 year, 8 months ago by  daniel123.
    • This topic was modified 1 year, 8 months ago by  daniel123.
    • This topic was modified 1 year, 8 months ago by  daniel123.
    • This topic was modified 1 year, 8 months ago by  daniel123.
    #9966

    daniel123
    Participant
    Post count: 52

    Anyone?

    #9972

    AC
    Blocked
    Post count: 7712

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

    #9974

    daniel123
    Participant
    Post count: 52

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

    #9994

    daniel123
    Participant
    Post count: 52

    Nevermind I figured it out.

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘How To Apply These CSS Effects?’ is closed to new replies.