F3 Slider - Centering content

[Travis]

I am creating a help file to walk endusers through the steps of setting up their computer. In the different sections, I am using a slider with and image and text for the user to follow. The user can click the arrows on either side or the navigation dots on the bottom to move it along.

I can get the arrows and the dots to stay in the same position, but the image and text will not center. It seems like I need to manually adjust each of the variables in the slide contents.

Details:

• the images are different sizes
• the text content is of different lengths in the slides.
• I currently have the following nested items:

• Slider
• Content
• Container
• Spacing (to try to get it all centered)
• image
• Header
• Paragraph
• Divider (to keep the navigation dots spaced away from the text)

The only way I have been able to get all the content to center is to create same sized PNG slides of the images and text. I don’t want to continue this as it is a nightmare to update the content. I need to be able to open RW, and edit the text and images quickly.

Is there is a “Vertical Center” as part of F3 and I am missing it?

Any suggestions to make this less complicated would be appreciated.

[elixirgraphics]

Interesting use case. Try the Background tool within each slide.

You can:
(1) set a height at each breakpoint
(2) set the vertical alignment within that background (when using responsive heights)
(3) bonus: add a nice pleasing background color

Let me know if that’ll work for this unique situation.

[Travis]

• added the Background Tool to the slide
• set Height Mode to “Responsive”
• set the height to specific pixel height
• set Content Align to “Center”
• added a Container Tool to the Background
•• Set Custom Height and Width to container
•• Set Align Content to “Center”
• added the content to the container (Image, Header, Paragraph, Divider

)

[elixirgraphics]

Looking nice! You might incorporate the Spacing tool in there, too.

[Travis]

OK. I added the Spacing Tool. I think I will need to adjust the margins as needed in individual slides.

[Travis]

To give a little context on the use case, here are some screenshots of the initial screen and the one tab I was working on (Company Information redacted).