• TO DOWNLOAD YOU NEED TO BUY AN UPGRADE

Fix? background image stops under header

HAWK

Administrator
Staff member
ADMIN
MODERATOR
XENFORO 2 SVIP
XENFORO 2 VIP
XF1 SVIP
XF 1 VIP
VERIFIED
REGISTERED
#1
To make the background image reach the top of page despite header height, I needed to modify the header.css template like so:

Go to Templates/header.css

CHANGE:

#header
{
@property "header";
background: rgb(some numbers) url('path/to/style/image') repeat-x top;
@property "/header";
}

TO:

#header

{
@property "header";
background: transparent;
@property "/header";
}

CHANGE:

#logo {
display: block;
float: left;
line-height: {xen:calc '@headerLogoHeight - 4'}px;
*line-height: @headerLogoHeight;
height: @headerLogoHeight;
max-width: 100%;
vertical-align: middle;
}

TO:

#logo {
display: block;
float: left;
line-height:0px;
*line-height: @headerLogoHeight;
height: @headerLogoHeight;
max-width: 100%;
vertical-align: middle;
}

The values you will find may differ a bit, but the main changes have to do with
- make the header background transparent
- change the height of the logo to 0px



Hope it helps someone else some day! Those little things can drive you nuts sometimes...
 
Top