1 Pixel Stroke around image?

Lou Gonzalez

For the life of me I can't figure out how to apply a 1 pixel outline around my images in Smugmug Gallery style?

My wedding spreads are just floating in a sea of white so I would like a thin outline around the images and thumbs.

http://photos.fernandogonzalez.net/2013/OKeefe/Wedding-Album/n-n5gqX

I can't find a place to adjust this. Am I missing it? Or does it require custom CSS?

Thank you!

leftquark

Lou Gonzalez wrote: »

For the life of me I can't figure out how to apply a 1 pixel outline around my images in Smugmug Gallery style?

My wedding spreads are just floating in a sea of white so I would like a thin outline around the images and thumbs.

http://photos.fernandogonzalez.net/2013/OKeefe/Wedding-Album/n-n5gqX

I can't find a place to adjust this. Am I missing it? Or does it require custom CSS?

Thank you!

From my post on Frequently Requested Mod's here: http://www.dgrin.com/showthread.php?t=237930

/* Add 1 pixel border around the thumbnails and photos */
.sm-user-ui .sm-gallery-smugmug .sm-image {
  border: 1px solid #4F4F4F;
  padding: 0px;
}

/* Set the overflow of the images to be visible so the border actually displays properly */
.sm-user-ui .sm-gallery-smugmug .sm-tile-content {
  position: relative;
  display: block;
  overflow: visible;
}

Lou Gonzalez

That worked! Thanks so much!

Lou Gonzalez

Is there a way to add a stroke around an image in Lightbox view?

Here is one of my album spreads that definitely needs an outline.

http://photos.fernandogonzalez.net/2013/OKeefe/Wedding-Album/n-n5gqX/i-xLFBwHM/A

I checked your customization guide and didn't see anything for this. Any ideas?

Lou Gonzalez

Figured it out using your code and Firebug.

/* Add 1 pixel border around the image in Lightbox view */
.sm-lightbox-image {
  border: 1px solid #4F4F4F;
  padding: 0px;
}

Lou Gonzalez

leftquark wrote: »

From my post on Frequently Requested Mod's here: http://www.dgrin.com/showthread.php?t=237930

/* Add 1 pixel border around the thumbnails and photos */
.sm-user-ui .sm-gallery-smugmug .sm-image {
  border: 1px solid #4F4F4F;
  padding: 0px;
}

/* Set the overflow of the images to be visible so the border actually displays properly */
.sm-user-ui .sm-gallery-smugmug .sm-tile-content {
  position: relative;
  display: block;
  overflow: visible;
}

Aaron thanks so much for your help on this. I was hoping you could maybe help with one other thing (related to this). For some reason, images that are not a 3x2 proportion are not alinging to the top of the gallery space. Check it out: http://photos.fernandogonzalez.net/2013/OKeefe/Wedding-Album/n-n5gqX/i-N897Lqx

They appear centered within the height of the entire gallery space. So I'd like find a way to make it align with the top of the gallery thumbs.

Any ideas?