CSS Border Question

WiscoFrankWiscoFrank Registered Users Posts: 161 Major grins
edited August 10, 2013 in SmugMug Customization
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.

Comments

  • WiscoFrankWiscoFrank Registered Users Posts: 161 Major grins
    edited August 5, 2013
    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.
  • ReturningHomeReturningHome Registered Users Posts: 30 Big grins
    edited August 5, 2013
    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!!!!! clap.gifivarwings.gif
  • ButlerkidButlerkid Registered Users Posts: 260 Major grins
    edited August 9, 2013
    Will the same code work to put a white border around thumbs on folders and galleries.... in collage landscape view?
  • WiscoFrankWiscoFrank Registered Users Posts: 161 Major grins
    edited August 10, 2013
    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.
  • ko04ko04 Registered Users Posts: 370 Major grins
    edited August 10, 2013
    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?
  • WiscoFrankWiscoFrank Registered Users Posts: 161 Major grins
    edited August 10, 2013
    Not sure .. doesn't effect my Logo. Maybe someone who knows CSS better than I do can help.
  • thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited August 10, 2013
    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%;
    }
    
  • WiscoFrankWiscoFrank Registered Users Posts: 161 Major grins
    edited August 10, 2013
  • ko04ko04 Registered Users Posts: 370 Major grins
    edited August 10, 2013
    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!
Sign In or Register to comment.