Title: Customize gallery thumbnail styling
Last modified: August 30, 2016

---

# Customize gallery thumbnail styling

 *  [slachhman](https://wordpress.org/support/users/slachhman/)
 * (@slachhman)
 * [10 years, 9 months ago](https://wordpress.org/support/topic/customize-gallery-thumbnail-styling/)
 * Hi, I want to change the colour/width of the white frames around each of my gallery
   stacks – i’d like to make them a bit thinner and perhaps change them to a dark
   grey colour. how can i do this using custom CSS? been playing around with it 
   for a few days and no luck.
 * thanks!
 * [http://www.defunkt.co/photos/](http://www.defunkt.co/photos/)
 * [https://wordpress.org/plugins/foogallery/](https://wordpress.org/plugins/foogallery/)

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Author [bradvin](https://wordpress.org/support/users/bradvin/)
 * (@bradvin)
 * [10 years, 9 months ago](https://wordpress.org/support/topic/customize-gallery-thumbnail-styling/#post-6457734)
 * What is your current custom CSS that you have built up so far and I can build
   on that?
 *  Thread Starter [slachhman](https://wordpress.org/support/users/slachhman/)
 * (@slachhman)
 * [10 years, 9 months ago](https://wordpress.org/support/topic/customize-gallery-thumbnail-styling/#post-6457740)
 * i viewed the css using chrome dev tools and found this:
 * .foogallery-album-gallery-list {
    list-style: none !important; padding: 0 !important;}
 * .foogallery-album-gallery-list .foogallery-pile {
    position: relative; z-index:
   10; float: left; margin: 10px 15px 15px 10px !important; }
 * /* Stacks creted by the use of generated content */
    .foogallery-album-gallery-
   list .foogallery-pile:before, .foogallery-album-gallery-list .foogallery-pile:
   after { content: “”; width: 100%; height: 100%; position: absolute; border: 8px
   solid #888; left: 0; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3); -moz-box-
   shadow: 0 1px 4px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);-
   webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-
   box; } /* 1st element in stack (behind image) */ .foogallery-album-gallery-list.
   foogallery-pile:before { top: -3px; z-index: -10; -webkit-transform: rotate(2deg);-
   moz-transform: rotate(2deg); transform: rotate(2deg); } /* 2nd element in stack(
   behind image) */ .foogallery-album-gallery-list .foogallery-pile:after { top:-
   2px; z-index: -20; -webkit-transform: rotate(-2deg); -moz-transform: rotate(-
   2deg); transform: rotate(-2deg); }
 * .foogallery-album-gallery-list .foogallery-pile .foogallery-pile-inner {
    border:
   8px solid #333; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); -moz-box-shadow:
   0 1px 4px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); overflow:
   hidden; line-height: 0; }
 * .foogallery-album-gallery-list .foogallery-pile .foogallery-pile-inner a {
    display:
   inline-block; }
 * .foogallery-album-gallery-list .foogallery-pile img {
    }
 * .foogallery-album-gallery-list .foogallery-pile h3 {
    background: #FFF; position:
   absolute; display: block; bottom: 0px; padding: 5px 5px 0 5px; width: 100%; box-
   sizing: border-box; margin: 0; opacity: 0.6; line-height: 1em; }
 * .foogallery-album-gallery-list .foogallery-pile h3 span {
    display: block; font-
   size: 0.6em; }
 * .foogallery-album-gallery-list .foogallery-pile a {
    position: relative; }
 * .foogallery-album-gallery-list.alignment-left {
    text-align: left; }
 * .foogallery-album-gallery-list.alignment-center {
    text-align: center; }
 * .foogallery-album-gallery-list.alignment-right {
    text-align: right; }
 *  Thread Starter [slachhman](https://wordpress.org/support/users/slachhman/)
 * (@slachhman)
 * [10 years, 9 months ago](https://wordpress.org/support/topic/customize-gallery-thumbnail-styling/#post-6457741)
 * i’m not sure how to override this using custom CSS

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Customize gallery thumbnail styling’ is closed to new replies.

 * ![](https://ps.w.org/foogallery/assets/icon-256x256.gif?rev=2602542)
 * [Photo Gallery by FooGallery : Responsive Image Gallery, Masonry Gallery & Carousel](https://wordpress.org/plugins/foogallery/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/foogallery/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/foogallery/)
 * [Active Topics](https://wordpress.org/support/plugin/foogallery/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/foogallery/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/foogallery/reviews/)

## Tags

 * [appearance](https://wordpress.org/support/topic-tag/appearance/)
 * [gallery](https://wordpress.org/support/topic-tag/gallery/)
 * [styling](https://wordpress.org/support/topic-tag/styling/)

 * 3 replies
 * 2 participants
 * Last reply from: [slachhman](https://wordpress.org/support/users/slachhman/)
 * Last activity: [10 years, 9 months ago](https://wordpress.org/support/topic/customize-gallery-thumbnail-styling/#post-6457741)
 * Status: not a support question