Set up images export to fit both horizontal and vertical screen in ePub in InDesign

Forum|Forum|1 year ago
May 8, 2024
1 reply
789 views

Hi! I'm a newbie in creating epubs. I've completed some basic steps for my epub and tested it on Kindle Previewer. It looks great in portrait mode, but when switched to landscape mode it's really a disaster. The pictures have been cropped vertically. I know this error is because I set the size incorrectly in Object Export Options. I don't know how to set up this part so that my pictures can automatically adjust to fit the screen frame in both landscape and portrait modes (70% of the frame for example) like the picture I attached.

If I have to implement this with CSS, please guide me, I can understand a bit about this part.

Thank you very much.

This topic has been closed for replies.

BobLevine

Community Expert

Have you tried this in other EPUB readers?

B

Bing Ng.Author

Participant

I have tried it on my devices like ibook on laptop, iphone and basic kindle. Even when I set the size to default or custom height: 80vmin it shows the entire picture. Meanwhile, when I test with Kindle Previewer, it is in the same situation as the picture below. I am confused, I do not know when I publish it with kindle whether it will encounter the same problem or not?

Can I ask you, what do you think is the best practice or the setting you often use for images when exporting epub file from InDesign?

Thank you very much.

B

Bing Ng.Author

Participant

Couple items and a question or two. First for kindle, only ever use previewer to test the ebook, past couple years amazon has moved away from saying to test on devices or apps besides previewer, their recommendation, so I'd do that first. Second, so the first image you posted, vertical and horizontal in your original post, when you flip it horizontally that's what you will see, the image will have the white space on the left and right, because it can't fill it entirely unless it's a more horizonal image. For amazon also remember, nothing too fancy for them, to them a dropcap high styling, so just a word of warning. Your image looks like it is also seetup to be centered and space above and below so that's where the text will go. This could have been done in indesign or if you altered any css afterwards. But let me know if you are looking to accomplish something else in case I misunderstood what you want to do.

Thank you for your answer. The two pictures of the bonsai tree that I sent are my target format, that is, the picture can automatically adjust to fit both horizontal and vertical layouts, which shows the entire image with a few lines of text. Right now, I have been able to set it up to automatically adjust to fit the screen frame like the picture I sent below (I anchored it on a separate paragraph and set the Image size to default). But if I want it to come with a few more lines of text (like the picture with the bonsai tree), how do I need to adjust the Object Export Options or CSS. I would greatly appreciate if you could show me this.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded