Twenty Ten theme, remove of change colour of gallery border

  • Author
    Posts
  • #1201988

    glindev
    Member

    My blog is glindev.wordpress.com and also glin.info
    I’m using twenty ten theme
    The gallery on the ‘home page’ has a black border – i want to remove it – or at least make it white.
    There will be many galleries on the site eventually – is there a solution for the entire blog or is it per gallery?
    I have Custom Design access but am new to CSS.
    Any help / advise most welcome.

    The blog I need help with is glin.info.

    #1202109

    johndcoy
    Staff

    Hello,

    If you would like to change the color of the border you can use the code below.

    .slideshow-window {
    border: 20px solid #fff;
    }

    The slide show also has a background color that will show in the event that an image does not have the same aspect ratio as the slide window. Here is the code to change that background.

    .slideshow-window {
    background-color: #222;
    }

    And if you like to change both you can combine the two.

    .slideshow-window {
    background-color: #222;
    border: 20px solid #fff;
    }

    Last, because you mentioned having the border removed you also can tell the border not to display.

    .slideshow-window {
    border: 0 none;
    }

    #1202139

    glindev
    Member

    Thanks for you answer.
    Where do I put this code?
    Is it via Appearance, Custom Design & into the CSS Stylesheet Editor (ie do it once for every gallery in the blog)
    OR
    is it into the Text tab of the page the gallery is on (ie, do it for every gallery)
    OR
    something completely different.
    I’ve tried both, neither appeared to work. I am new to CSS so appreciate your patience. Blog is http://www.glin.info

    #1202153

    Yes, you put it into the CSS edit window you mention. This would affect all slideshows, so it only has to be done once.

    #1202166

    glindev
    Member

    I suspect I’m being rather stupid.
    I think I did what you suggest – put the code above into the CSS & save. However, the black border still appears around the images in my gallery at http://www.glin.info
    Any advice?

    #1202171

    We need a bigger hammer, so to speak in this case. Delete what you added and add this instead. The “!important” attribute will force your CSS rule to override the slideshow’s CSS.

    .slideshow-window {
    border: 20px solid #FFFFFF !important;
    }
    #1202178

    glindev
    Member

    You are a true guru to me…
    I modified your latest advise to the following & it appears to work just fine – is my modification OK?

    .slideshow-window {
    border: 20px solid #FFFFFF!important;
    }

    .slideshow-window {
    background-color: #FFFFFF!important;
    }

    #1202180

    Absolutely OK.

    #1202264

    johndcoy
    Staff

    If you want to ‘tighten-up’ your markup you can combine the two.

    .slideshow-window {
    border: 20px solid #FFFFFF!important;
    background-color: #FFFFFF!important;
    }

The topic ‘Twenty Ten theme, remove of change colour of gallery border’ is closed to new replies.