WordPress.org

Support

Support » Themes and Templates » Borders mix up with smileys

Borders mix up with smileys

  • .wp-smiley {
    border:none;
    margin:0;
    padding:0;
    }

    Thats suppose to have no border whatsoever on smileys. Although, I have border: 1px solid #ccc for images and WP is reading the smiley as an image. Is there a way I can turn that off? I want my images to have borders exept the smileys. I added the class, no help.

Viewing 15 replies - 1 through 15 (of 16 total)
  • It’s being overridden by the .primary img {} selector.

    You can beat that specificity by saying img.wp-smiley {border: 0;} (hat tip masquerade).

    Firas, thank you so much! :). I tried .wp-smiley img {border:0;} but never worked but yours did. Another new thing I learned about CSS :). Thanks.

    James Huff
    Support Team Rep.

    @macmanx

    Xero, I believe the Smily bug was fixed by K2 Alpha Four. And, for the second time, please post all K2 support requests in the Kubrick/K2 support forum.

    http://flickr.com/groups/binarybonsai/

    Macmanx, I dont think so. Plus, its still in “Current Known Bugs”. Also, i didnt consider this as a K2 support question. Just a .css question as any theme can have this problem…

    James Huff
    Support Team Rep.

    @macmanx

    Also, i didnt consider this as a K2 support question. Just a .css question as any theme can have this problem…

    That is possibly true, but if this was posted in the Kubrick/K2 Support Forums, then at least Michael would have been notified about the fix.

    Macmanx, I already did email Chris right after I fixed the problem. Chris works with Michael on K2, right? I couldnt find Michaels email so I emailed chris right after I added the code.

    James Huff
    Support Team Rep.

    @macmanx

    Chris works on the Options panel for K2, not the theme content, but I’m sure that he’ll forward the appropriate information to Michael.

    For future reference, you can contact Michael in regards to Kubrick and K2 issues by posting in the Kubrick/K2 support forum.

    please help me here. I have tried Firas’ suggestion on how to remove the borders in smileys, but still it doesn’t work with me. Please help me.

    Don’t see any borders.

    that is because I forcibly delete all borders for ALL images. how can I erase the border only on smileys?

    img.wp-smiley {border:none}

    no effect 🙁 I have returned all the CSS to bring back the borders, and I also typed in img.wp-smiley {border:none;} but there is no effect… 🙁

    here is the complete code of CSS for images on my mx4 theme:


    /********* Begin Images *********/

    img.wp-smiley {border:none;}

    /*img.wp-smiley {
    border:none;
    margin:0;
    padding:0;
    }*/

    .entry img {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    max-width: 334px;
    }

    .entrytext img {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    max-width: 392px;
    }

    .img {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    }

    .imgleft {
    float: left;
    margin-bottom: 6px;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    }

    .imgright {
    float: right;
    margin-bottom: 6px;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    }

    p img {
    max-width: 100%;
    }

    img.centered {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

    img.alignright {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    padding: 4px;
    margin: 0 0 2px 7px;
    display: inline;
    }

    img.alignleft {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    /*-moz-border-radius:5px;*/
    padding: 4px;
    padding: 4px;
    margin: 0 7px 2px 0;
    display: inline;
    }

    .gravatar {
    float: left;
    margin: 2px 10px 6px 0px;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    padding: 2px;
    }

    /********* End Images *********/

    hope it will help…

    You have given images a background of white, so in my testing the borders do disappear, however, the background is white. The more restrictive img.wp-smiley {border:none;} needs to go after most of the other img styles (many of which are redundant and some are irrelevant) – you should clean the img section up.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Borders mix up with smileys’ is closed to new replies.