WordPress.org

Forums

Cyclone Slider 2
[resolved] How can I center (crop) images in the slideshow? (4 posts)

  1. Shoestontx
    Member
    Posted 2 years ago #

    Hello, your plugin is amazing but I'm having one small problem. Some of the images I upload don't aren't centered properly causing a great deal of the picture to be oddly cropped out. How can I set it to where all images I upload are automatically centered? Thanks in advance!

    http://wordpress.org/extend/plugins/cyclone-slider-2/

  2. Chad Warner
    Member
    Posted 2 years ago #

    I added this CSS to my child theme's style.css file to center images that are narrower than the slider width:

    .cycloneslider-slide img { /* Cyclone Slider 2 plugin */
    	margin: 0 auto !important; /* center image in slider */
    }
  3. kosinix
    Member
    Plugin Author

    Posted 2 years ago #

    Hello guys,

    There is a good example on my site: http://www.codefleet.net/cyclone-slider-2/templates/lea/

    Click on the 7th slide with the pictures of wildebeest. As you can see I added a text-align:center on the image containing element:

    .cycloneslider-template-lea .cycloneslider-slide{
         text-align:center;
    }

    and similar to Chad Warner's comment above, add margin: 0 auto. BUT, adding !important is considered bad practice, so just make your style more specific (you can google that).

    So:

    .cycloneslider-template-lea img{
         display:block;
         margin:0 auto;
    }

    Note, you have to change .cycloneslider-template-lea to the class name of your template.

  4. edwinm
    Member
    Posted 1 year ago #

    Thanks Chad, worked a treat!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Cyclone Slider 2
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic