Our widescreen template have a responsive header image. Unlike Weebly’s standard header image, the height is fixed no matter what size monitor/device you are using, our themes have a truly responsive header. It measures the width of the monitor and calculate to adjust the height accordingly.
When you are in editing, the responsive header is NOT ACTIVATED. So you will see the image repeats at the bottom. This is caused by the website builder tool bar on the left. When the site is published, the tool bar will be gone and the website will than spend the full width of the browser. In the published site, the responsive header will than be activated. Our smart responsive headers keeps the image ratio in any monitor size and devices. It will calculate the width of your monitor and adjust the height of the image to match.
So when you are in editing mode, you may see the image repeat. However, this will be gone once the responsive smart header kicks in when your site is published.
Here is the breakdown of the header image ratio for different page layout:
1) Landing page = 2.7 width x 1 height (example for every 1px in height the width should be 2.7px)
2) Tall Header = 4.1 width x 1 height
2) Short Header = 6.7 width x 1 height