search

Phlow / feeling-responsive

»Feeling Responsive« is a free flexible theme for Jekyll built on Foundation framework. You can use it for your company site, as a portfolio or as a blog.
http://phlow.github.io/feeling-responsive/
MIT License
894 stars 1.33k forks source link

Full Width Image Headers #232

Closed Linux-Geezer closed 3 years ago

Linux-Geezer commented 3 years ago

Is there an ideal image resolution to use for full width, or fullwidth, image headers that will show the complete image; i.e. not cut off part of the image? I've played around with a few different resolutions and nothing seems to work. When using an image for a site header, I want it to display as the image does in an image viewer; i.e. nothing gets cut off.

Phlow commented 3 years ago

There is no perfect resolution for the full-width header.

Howeever you get an option for images in the header to resize properly according to their size. Have a look at:

Hope, that helps.

Linux-Geezer commented 3 years ago

Using a background pattern or color to properly resize an image is not a good option in my opinion. But thank you for your reply.

Phlow commented 3 years ago

It's a matter of taste. I wanted the header not to be oversize on small screens and still be responsive. But the beauty of this theme is: you can change it to the way you like it :)

You have to look into backstretch › https://github.com/Phlow/feeling-responsive/search?q=backstretch

Feeling Responsive uses Backstretch by Scott Robin to expand them from left to right. The width should be 1600 pixel or higher using a ratio like 16:9 or 21:9 or 2:1."