I want to export as a horizontal slider with scaling but would also like to add some padding around all sides?

Question

I would like to export as a horizontal slider with scaling but would also like to add some padding around all sides so the slider will float within the browser?

Answer 1

If you'd like to add padding to a document exported as a horizontal slider with scaling, you could export the original document with Desktop Scaling applied and then embed it into another document using the in5 Web Content interactive widget. Here's how:

1. Export the original document using Slider (Horizontal) page format and Desktop Scaling.
2. Create a new InDesign layout the size of the original document plus the amount of padding you want vertically and horizontally.
3. Draw a rectangle in the layout using the dimensions of the original document.
4. Go to in5 > Interactive Widgets > Web Content.
5. In the Web Content dialog, under URL or File, click the Browse button to navigate to the index.html file on your local hard drive of the originally exported document.
6. Export the new document also as Slider (Horizontal) with Desktop Scaling applied. You'll probably also want to deselect the Navigation options (Enable Swipe Navigation and Show Back/Next Arrows) in the Basic section of the export dialog.

Comments

Thanks Myra, I will experiment with your solution although it may be easier to just extend the document in InDesign to create the effect of padding. I was hoping there would be a way to quickly add it to the CSS or HTML.

---

Sounds good.

If you want to add padding via CSS, you can add your own custom CSS using the Resources section of the Export HTML5 with in5 dialog.

---

And which part of the CSS would I need to target?

---

I checked with Justin for some CSS. He said that you could try something like:

body { padding:40px; }

but he said that he guessed it won't work well.

I think the Web Content interactive widget approach will be much easier.