• 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

Looking for a Scribble theme image border css expert, please

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 › Looking for a Scribble theme image border css expert, please

This topic is: resolved

Tagged: css, image border, scribble

  • This topic has 14 replies, 3 voices, and was last updated 10 years, 1 month ago by Anita.
Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • January 25, 2013 at 4:36 pm #14842
    djw2
    Member

    I am trying to remove the image border around the social media icons I have added in the sidebar widget of the Scribble theme. But I still want to keep the white border around all other images for posts and pages. For now I have reduced it to 2px, until I can get this fixed.

    In the sidebar text widget I have the icons in an unordered list, if that helps.

    http://darlingchampagne.com/

    Here is the images css.
    /* Images
    ------------------------------------------------------------ */

    img,
    img a {
    -moz-box-shadow: 0 3px 5px #ddd;
    -webkit-box-shadow: 0 3px 5px #ddd;
    border: 2px solid #fff;
    }

    img.portfolio {
    border: 15px solid #fff;
    }

    #blog .featuredpage img,
    #blog .featuredpost img {
    margin: 0 0 15px;
    }

    #photos .featuredpage img,
    #photos .featuredpost img {
    margin: 0;
    }

    .entry-content img {
    max-width: 95%;
    }

    .author-box .avatar {
    background-color: #fff;
    float: left;
    height: 80px;
    margin: 0 10px 0 0;
    width: 80px;
    }

    .post-image {
    margin: 0 10px 10px 0;
    }

    .comment-list li .avatar {
    background-color: #fff;
    float: right;
    margin: 0 5px 0 10px;
    padding: 4px;
    }

    img.centered,
    .aligncenter {
    display: block;
    margin: 0 auto 10px;
    }

    img.alignnone {
    display: inline;
    margin: 0 0 10px;
    }

    img.alignleft {
    display: inline;
    margin: 0 15px 10px 0;
    }

    img.alignright {
    display: inline;
    margin: 0 0 10px 15px;
    }

    .alignleft {
    float: left;
    margin: 0 10px 0 0;
    }

    .alignright {
    float: right;
    margin: 0 0 0 10px;
    }

    .wp-caption {
    padding: 5px;
    text-align: center;
    }

    p.wp-caption-text {
    font-size: 12px;
    line-height: 16px;
    padding: 5px 0;
    }

    .wp-smiley,
    .wp-wink {
    border: none;
    float: none;
    }

    .gallery-caption {
    }
    Thank you for any help you can provide.

    DJ

    January 25, 2013 at 4:38 pm #14843
    djw2
    Member

    Here is the social icons css, I should have added in the previous post.

    /* Social Media Icons
    ------------------------------------------------------------ */

    .widget-area .social {
    float: left;
    margin: 20px 20px 10px 10px;
    padding: 24px 15px 4px 4px;
    width: 55px;
    height: 105px;
    border: 0;
    }

    January 25, 2013 at 5:01 pm #14852
    Anita
    Keymaster
    This reply has been marked as private.
    January 25, 2013 at 5:12 pm #14861
    djw2
    Member

    I don't know why it would go to error, but the site is still there. Everything seems ok to view the site, on my end.

    January 25, 2013 at 5:18 pm #14866
    Anita
    Keymaster

    Hummmm, it keeps going to a white screen with the word "error" on it on my end. One minute it's there, the next it says error. I've dumped my cache and I can't get it to come up on my end. I'll try again. In the meantime, try adding this to your style sheet. Let me know if it works.
    #text-2 .social {
    border: none;
    }


    Love coffee, chocolate and my Bella!

    January 25, 2013 at 5:30 pm #14872
    djw2
    Member

    I cleared my cache too and retried the site in Chrome, IE, Firefox and Safari, as well as my phone and they all come up ok. I don't know why you would get the error.

    I did try the code in the css that you provided, but it didn't change the border at all.

    January 25, 2013 at 5:38 pm #14878
    Anita
    Keymaster

    Okay, try this one:

    #text-3 {
    img, img a {
    border: none;
    }


    Love coffee, chocolate and my Bella!

    January 25, 2013 at 5:46 pm #14884
    djw2
    Member

    Tried it, but that didn't work either.

    January 25, 2013 at 5:51 pm #14891
    Anita
    Keymaster

    I forgot to add the social part. If this doesn't work, I don't know what will!! It's working for me using Firebug.

    #text-3 .social {
    img, img a {
    border: none;
    }


    Love coffee, chocolate and my Bella!

    January 25, 2013 at 6:11 pm #14904
    djw2
    Member

    Nope. Still doesn't work for me.  I know this is baffling.

    There seemed to be an extra bracket and I systematically removed each to see what might make a difference and neither did.

    I know this is baffling. I really appreciate your help though!

    January 25, 2013 at 6:12 pm #14905
    Anita
    Keymaster

    Did you hard code them or are you using a plugin?


    Love coffee, chocolate and my Bella!

    January 25, 2013 at 6:26 pm #14916
    djw2
    Member

    I'm entering it directly into the style.css in the theme. Not using a plugin.

    January 26, 2013 at 1:54 am #14968
    Leon
    Participant

    Hi,

    Replace this in your style.css

    #social {
    border: medium none;
    }
    #text-3 .social img, img a {
    border: 0 none;
    }

    with

    #social img {
    border: none;
    }

    January 26, 2013 at 2:10 am #14972
    djw2
    Member

    Hey, that did it!

    Thanks Leon and Anita both. Better than I was able to do myself.

    Much appreciated.

    January 26, 2013 at 7:18 am #14983
    Anita
    Keymaster

    OMGawd! I am so glad someone was able to figure this out! Thank you Leon! I have to book mark this one. I was hot, but no cigar!


    Love coffee, chocolate and my Bella!

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

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

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 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