View Single Post
Old 28th February 2016, 13:24   #1
Junior Member
Join Date: Feb 2016
Posts: 1
[Site Design Problem] Header Background Image Width not Full

I recently upgraded to a high resolution Ultrawide (21:9) monitor, whose resolution is 3440*1440px.
The background of the header (<header class="header"></header>) doensn't span across the full width of the header, and so, the first half of the header text is invisible (white over white).
The problem only persists using the full width of my screen, so it is just an image size problem.

Firefox developer edition says the value "container" for the attribute "background-size" on "header .homeheader" is invalid.

It can easily be fixed by adding "background-size: 100%". The Shoutcast logo gets clipped just barely, but that's the only easy fix that came to my mind, the only other option is sepparating the main bg (and making that 100% width, auto height) and then adding a sepparate div for the logo.

I hope it is useful and easy for you.
rgon is offline