WordPress.org

Ready to get started?Download WordPress

Forums

Removing Border from Images - Framed Redux Theme (6 posts)

  1. phoenixdoula
    Member
    Posted 1 year ago #

    Hi,
    I am trying to remove the border from images on my blog (http://peacelovefree.com). I'm usually able to manage simple css changes with no problem, but for some reason must be missing something here. In the process of trying to fix the border issue I also somehow shifted my header down and to the side. If anyone is able to help I greatly appreciate it. Thanks!

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Those "borders" are created by the padding here:

    .storycontent img.alignnone {
        background: none repeat scroll 0 0 #E4E4E4;
        border: 1px solid #FFFFFF;
        display: inline;
        margin: 0 0 10px;
        padding: 5px;
    }

    The problem with the header is the padding here:

    .logo {
        float: left;
        margin: 0;
        padding-left: 50px;
        padding-top: 25px;
        width: 400px;
    }

    I'd strongly suggest using Firebug to work with CSS and not making changes in theme files -- use a custom CSS plug-in or make a child theme. As is, all of your changes will be deleted when the theme is updated.

  3. phoenixdoula
    Member
    Posted 1 year ago #

    Thank you so much for the very quick assistance. I so appreciate it.

    Can you tell me more about using firebug, using a plugin-in or making a child theme? Which would you advise as best?

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Firebug is a browser add-on for Firefox that has a lot of developer tools that are really helpful. Definitely worth using -- I don't know how anyone could do CSS work without it :)!

    As to the other, see this for a child theme -- probably the better option if you are going to make many changes to your site:

    http://codex.wordpress.org/Child_Themes

  5. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Oops forgot this:

    https://getfirebug.com/

    There is lots of good info on their site for how to use it, etc.

  6. invot
    Member
    Posted 1 year ago #

    Firefox has an AMAZING code inspector built into it. No plugin required. I really suggest using it. It saves me a ton of time with debugging stylesheets. Just right-click and go to "Inspect Element". The bar on the right will show you where those renegade styles are being inherited.

Topic Closed

This topic has been closed to new replies.

About this Topic