How could I make the texts surround the slider

Hi,

Am I correct in assuming that you’d like to place a slideshow in a post or a page and to surround that slideshow’s top and bottom with text? In the post/page editor, it would simply look like this:

Your text here, your text here,
your text here, your text here

[slideshow_deploy id='yourSlideshowID']

More text here, more text here, more text here,
more text here, more text here,

Best regards,
Stefan

Hi Stefan:

Thanks for helping.

I want to make a part of page like this: https://ca.movies.yahoo.com/news/california-police-comedian-katt-williams-evaded-arrest-234707810.html

And I use the html code like

<!-- slideshow -->
<div id="e073">[slideshow_deploy id='515']</div>
<!-- texts -->
<div id="e074" class="texts"> texts here </div>

Therefore, the texts could be set at a big block, and the slideshow is set at a same place but smaller block.
And then the texts could be shown in its block but avoid the slideshow, which makes it like surround the slideshow.

I want know how to write the css codes, which makes it like “float” a imagine.

Could you help me to do that?

Thank you,
Best regards

Thanks for providing the example, that makes it much clearer.

As you can see, is the image on yahoo.com set with the CSS value: ‘display: inline-block;‘. This makes the text wrap around it.

If you set the slideshow’s containing block to that CSS value, and give it a fixed width, the text may wrap around it.

More information on the display property can be found here.

Hi Stefan:

It does not work.

I just set the “display: inline-block;” to the slideshow, and try both relative and absolute positions of the texts, and then move it to the slideshow, but it still cover on the imagine.

It seems like this kind of code only works on <img>.

Anyway, if you do not know how to solve, that’s fine. I could use other ways.

Thanks for helping again,

Have a good day ??

Okay, perhaps this post on StackOverflow.com can help you.

Hi Stefan:

Thanks for helping. I get it now.

One more question, now the “preview/next arrow” looks no so good,
is there any way to change the style?

like, could I change it in “.slideshow_container .controlPanel ul { }” or others.

I want to change to like this https://www.honda.com/

Thanks ??

Hi,

I’m sorry for my late response, I must’ve missed your post.

You can set the style setting to ‘Custom’ to change the style of the slideshow. There you can fiddle with the ‘.button’ and the ‘.next’ and ‘.previous’ button classes.

Best regards,
Stefan