Tweet
Hi,
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.
Cheers.
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.
Cheers.