[Plugin: Meteor Slides] left align slides

Yes, add a copy of the stylesheet to your theme, and float it to the left by editing the first CSS statement:

.meteor-slides {
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
	overflow: hidden;
	float: left;
}

Then any text that is added after the slideshow should wrap around it. You might have to play with it a bit though depending in your theme and where you place the slideshow.

how can i add space between the slides and the text?

You should be able to just set the margins of the meteor-slides division to accomplish this:

.meteor-slides {
	margin: 0 20px 0 0;
	padding: 0;
	position: relative;
	z-index: 1;
	overflow: hidden;
	float: left;
}

But it depends on your theme, if you post link to the page you are working on I can give you more specific info.

I tried changing the margin and it didn’t work. Page is https://www.highcaliberfirearms.net/
Thanks

You can’t make these changes from your theme’s stylesheet, the plugin’s stylesheet with override most of them. But if you copy the plugin’s stylesheet to your theme as described in the FAQ, the plugin uses that stylesheet instead, and you can make your changes from there.

Where will I access the plugin stylesheet once i put it in the themes directory?

Are you making these changes via FTP or via the theme editor?

I got it. Thank you for your help.

Cool, no problem.

Hi there. Thanks for the great plugin. One thing tho. First slideshow (horizontal on “home” page) worked great with the above fix. On the second one (vertical on “rates” page) the text runs right up against the pics. Padding doesn’t seem to help. I tried increasing the width of the pic, but the pic was centering itself in the space, which doesn’t work.

Any way to pad or at least left align the pic in the pic space? (this would be a sneaky, easy little trick)

thanks for your time!

https://eloquentarts.org/rates/

ps. tried margin too…

Hi swazzi, thanks for trying my plugin! If you are planning to have all of your slideshows left aligned with text around them like that, I would float them to the left and add a margin around them by adding something like this to your theme’s stylesheet:

#page .meteor-slides {
    float: left;
    margin: 0 20px 20px 0;
}

If you only want some of the slideshows styled this way you could use an ID to target a specific slideshow like this:

#page #meteor-slideshowvertical {
    float: left;
    margin: 0 20px 20px 0;
}

That worked beautifully! (I forgot to mention i’m learning code by trial and error. still not clear on labels in css. But it’s starting to make sense.)

Your plugin is great. will contribute and spread the word.

thanks for the superquick helpful response!

ciao

me again. any way i can have a variable width slideshow?

thanks

No problem! How exactly do you want it to be variable? To fit different sized images, or for the slideshow width itself to change depending on how much room it has?