[SOLVED] Center Images Horizontally on Slideshow

Hello i have a site where i use Slideshow Gallery Plugin, the problem is that i have a lot of images from different sizes and my gallery is always 900px wide... i will like to center all the images on my gallery. 

I see on the code that each image is css positioned absolute, and left:0 wich aligns the image to the left, can i center the image? i know how to do that using css but the problem is that i dont know in a future the width of each image. 

Also i notice that the images are 1 over the last one... so if the current photo is smaller thant the last one... the last one the user can see a portion of the last image... this looks bad :( 

Thanks in advance

Comments

  • 14 Comments sorted by
  • Vote Up0Vote Down
    Thank you for your post, benrivero.

    You can center the images with CSS.

    Can you pass me a link to check for you and provide some CSS guidance?

    I look forward to your response!
  • Vote Up0Vote Down
    Hi benriviero,

    I'm just following up to find out whether your issue has been resolved?

    If so, we would appreciate it if you would kindly post a reply here for the good of the community explaining how it was resolved, and also mark this thread as SOLVED by editing the title as explained in the sidebar on the right.

    Kind regards,

    Phil
  • Vote Up0Vote Down
    Hi benriviero,

    I'm just following up again to find out whether your issue has been resolved? Perhaps in a support ticket?

    If
    so, we would appreciate it if you would kindly post a reply here for
    the good of the community explaining how it was resolved, and also mark
    this thread as SOLVED by editing the title as explained in the sidebar
    on the right.

    Kind regards,

    Phil
  • Vote Up0Vote Down
    We have applied this to our latest development build.

    To automatically center align images when "Resize Images" is turned off and the images smaller then the slideshow canvas. So this will be in the next release.

    In the meanwhile, go into your "slideshow-gallery/css/gallery-css.php" file and you'll need to modify the #slideshow-wrapper #image img style specifically. Here is the new code for it: http://pastebin.com/QWMD58CG

    Please let me know if this helps!
  • Vote Up0Vote Down
    I got referred here through another comment thread... And I found my solution...


    Thank you so much for the resolution document!!!!


    Sofia
  • Vote Up0Vote Down

    Hi Team,

    I was trying to center image with the new version of your (trully great) plugin, but there is no gallery-css.php anymore. Could you provide me the way of how to do this now? As a little offtopic I'd like to ask where can I state the margins of the image to make it really in the center (covered by those black margins)?

     

    Best regards,

    Paweł

  • Vote Up0Vote Down

    @Paweł_J

    I'm glad to hear that you like the Slideshow Gallery plugin.

    There are css.php and css-responsive.php files that you can use to modify CSS. You can use a child theme folder to make changes and keep them intact on updates. See this documentation: http://tribulant.com/docs/wordpress-slideshow-gallery/9577

    Have you tried margin:0 auto; to center align images? If it doesn't work, may I have a link to your slideshow to check it out and see how it can be done?

    I look forward to your response.

  • Vote Up0Vote Down

    Thank you for such a fast response. I have created a child theme, copied css.php and css-responsive.php files and as I don't really get what is going on in the files I tried to change all the occurances of margin:0 to margin:0 auto, but nothing happened. I use responsive layout and I still edit the site locally so unfortunatelly it would take some time to send you a link (I could do that, though).

     

    I look forward for your response,

    Paweł

  • Vote Up0Vote Down

    @Paweł_J

    No problem, you're welcome, I'm happy to assist you.

    Can you please put the site online at some stage and then pass me a link? The center alignment may actually differ from site to site depending on the main CSS and layout of your WordPress theme and the parent elements that the slideshow is inside.

    I look forward to your response.

  • Vote Up0Vote Down

    Now - I tried to change all the occurances to margin:0 auto too but the images are still aligned left.

    In the theme-style.css is not a different code for images.

    So, I still have this problem...

  • Vote Up0Vote Down

    @Chica

    Can you please provide a link to your slideshow?

  • Vote Up0Vote Down

    Along this same query, I am wondering how I can center the slideshow on my page. Here is my page:

    http://oakcliff.ofthecastlemarketing.com/studio-images/

    I tried wrapping a p tag around it with the center attribute but it ignores this. From reading the forum, I believe I have to make changes inside the gallery.php file within a child folder (slideshows) but I have tried this and it didn't work. I am assuming I might be changing something in the wrong area. I am surprised to not see a separate .css file to edit. I don't want to make these changes in my regular .css file because I don't want anything other than the slideshow to be affected.

    I appreciate your help.

    Thanks!

  • Vote Up0Vote Down

    Problem solved when I bought the Pro version. Thanks.

  • Vote Up0Vote Down

    @OTCM

    Thank you for your response.

    And I'm glad to hear that the problem is resolved.

Sign In or Register to comment.