Ideal banner size or ratio: 3 questions

I want to use a picture for the banner in Foundry that consist of a drawing and text, right beside it. I want this drawing and text staying always in the middle of the banner.
I already use the stack Margins and Vertical. But I don’t get the settings right for the mobile break.

3 questions:

  • what is in general the ideal size or ratio between height and width?
  • what are the best settings for the break points?
  • what is the best setting for the Layout of these stacks: fill, fixed size, float or flexible?

Hey there @denkkracht

If you can give us an example of what you’re referring to for your specific problem we can take a look and offer advice. It sounds like you’re using your image as the backdrop of the Banner stack. The Banner will crop and size this image in order to keep the proportions of the image as well as cover the entirety of the background. The height of the Banner area changes based on the width of the device, as well as the size of the content in the banner at each breakpoint.

If you want just a plain image that is 100% visible at all times as the banner area of your site, you can indeed use an Image stack to achieve that. Since that image isn’t the background though of a stack you won’t be able to insert content on top of that image.

There are tradeoffs in web design, especially responsive web design, and this is one of those.