Editing the box around the basic slideshow feature
-
Hi,
My wordpress website is here: http://lacomunidadqueconstruimos.org
I am trying to edit the size of the outline box on the slideshow I just added. I used the following code to make the bottom of the outline box shorter, but I can’t seem to make the top shorter.
.slideshow-window .slideshow-slide img {
max-height: 360px !important;
}.slideshow-window {
height: 360px !important;
}I understand that the box is bigger to accommodate bigger pictures, but I don’t have any vertical pictures in the slideshow and would like to box to just be slightly bigger than the horizontal pictures I’ve included as to not take up so much space on my homepage.
Are there any CSS codes to change the height of the top of the box?
Thanks!
The blog I need help with is: (visible only to logged in users)
-
One alternate suggestion might be to get rid of the slideshow background and border, like this:
div.slideshow-window { border: none; background: none; margin: 0 20px; }Or if you want to keep the border and background black but tighten up the space, it’s a little tricky because every differently sized image will get centered and CSS like this affects all slideshows (including future ones) you add so it may not work perfectly for every slideshow instance. Having said that, you could manually move the images in the slideshow up and shorten the height:
div.slideshow-window { height: 330px !important; } div.slideshow-slide { top: -40px !important; }I’m not convinced it’s the best solution, but you can try it out! Make sure other slideshows you’ve added still look good after you make a change. Or, if you wanted to limit the update to just the home page, you could do this instead:
.home div.slideshow-window { height: 330px !important; } .home div.slideshow-slide { top: -40px !important; } -
Those both worked perfectly, but I liked the look of the second one better. Thanks so much!
-
- The topic ‘Editing the box around the basic slideshow feature’ is closed to new replies.