CSS Border Question

WiscoFrank

So trying to put a simple 15px white border arounf the slide show. Here's the code I'm using.

.sm-slideshow {
border: 15px solid #fff;
}

Border looks fine but for some reason all I can get is a grey border. I'm sure it's something simple but I don't have a lot of CSS experience.

WiscoFrank

Well think I answered my own question so I'll post the code that seems to work in case it helps others

.sm-tile-content {
position: relative;
display: block;
background-color: transparent!important;
overflow: visible;
}

.sm-tile-single.sm-tiles-uncropped .sm-image {
border: 10px solid #fff;
max-width: 95%}

Just a modified version of Jingle Images border & drop shadow code.

ReturningHome

WiscoFrank wrote: »

Well think I answered my own question so I'll post the code that seems to work in case it helps others



Just a modified version of Jingle Images border & drop shadow code.

Thank you for sharing!!!!! ivar

Butlerkid

Will the same code work to put a white border around thumbs on folders and galleries.... in collage landscape view?

WiscoFrank

Butlerkid wrote: »

Will the same code work to put a white border around thumbs on folders and galleries.... in collage landscape view?

I'm sure it would if you added the Border command and pointed to the folder or thumb object. Here's a link to Jingle's drop shadow code for folders, galleries and slide show http://www.dgrin.com/showthread.php?p=1885083#post1885083.

I'll try to play around and see if I can modify for borders on folder thumbs and post something if I can.

ko04

do you know why it is that using this code it ends up putting a border around my logo? I mean I'm using a photo box because thats the only way I've found to make my logo center so if thats why how do I block it from effecting that box and only going on the slide show?

WiscoFrank

Not sure .. doesn't effect my Logo. Maybe someone who knows CSS better than I do can help.

thenickdude

The code posted is a bit too general, try this variant which restricts it to apply only to the slideshow element:

.sm-page-widget-slideshow .sm-tile-content {
  position: relative;
  display: block;
  background-color: transparent!important;
  overflow: visible;
}

.sm-page-widget-slideshow .sm-tile-single.sm-tiles-uncropped .sm-image {
  border: 10px solid #fff;
  max-width: 95%;
}

WiscoFrank

Thanks Lamah.

ko04

WiscoFrank wrote: »

Not sure .. doesn't effect my Logo. Maybe someone who knows CSS better than I do can help.

I understand I can grasp the coding and the concepts but if it's anything to technical I usually get lost thou thank you for your code.

Lamah wrote: »

The code posted is a bit too general, try this variant which restricts it to apply only to the slideshow element:

.sm-page-widget-slideshow .sm-tile-content {
  position: relative;
  display: block;
  background-color: transparent!important;
  overflow: visible;
}

.sm-page-widget-slideshow .sm-tile-single.sm-tiles-uncropped .sm-image {
  border: 10px solid #fff;
  max-width: 95%;
}

Thank you for your code and reply I'll give it a try!