WordPress.com Forums » Topic: Header stationary when browser size changes

designsimply on "Header stationary when browser size changes"

designsimply — Thu, 06 Dec 2012 18:00:07 +0000

Separately, I'd also like to know if there's a way I can make the header a link to the homepage of the site.

There is not a way to add links using CSS only, but what you can do is add something that does have a link, such as the Appearance → Theme Options → Logo in this case, and then you can use the link itself when you replace the background image and then the link will still work. Since your site doesn't have a logo setup, I couldn't test on it directly, but here is an example you can start with using the Preview option on the Appearance → Custom Design → CSS page:

#header-left {
	padding: 0;
}
#header-left .site-title {
	margin-bottom: 0;
}
#header-left h1 a {
	display: block;
	width: 980px;
	height:180px;
	background: url('http://kidlitnetwork.files.wordpress.com/2012/11/klnheader1.jpeg') center no-repeat;
}
#header-left h1 a img {
	display: none;
}
#header-right {
	display: none;
}

You may need to adjust the CSS a little based for your blog.

kidlitnetwork on "Header stationary when browser size changes"

kidlitnetwork — Thu, 06 Dec 2012 17:36:54 +0000

Yes - we've resolved the issue. Thank you!

designsimply on "Header stationary when browser size changes"

designsimply — Thu, 06 Dec 2012 17:36:02 +0000

When I change the size of my browser window, the header remains stationary while the page moves, therefore making it off-center.

I tried testing this at http://kidlitnetwork.com/ but the header always looks centered to me when I changed the browser window size.

It looks like you might have fixed this by manually replacing your header image using the following CSS. Is that what happened?

#header-right {
	display: none
}
#header {
	background: url('http://kidlitnetwork.files.wordpress.com/2012/11/klnheader1.jpeg') no-repeat center;
	width:100%;
	height:180px
}

musictravelwrite on "Header stationary when browser size changes"

musictravelwrite — Sat, 10 Nov 2012 06:44:15 +0000

Can anyone help me with this? I've been on a ton of different CSS forums and sites over the last few days and nothing seems to work.

Thank you!

Michelle

musictravelwrite on "Header stationary when browser size changes"

musictravelwrite — Fri, 09 Nov 2012 00:34:09 +0000

Hello,

I have the On Demand theme and the custom upgrade. When I change the size of my browser window, the header remains stationary while the page moves, therefore making it off-center. I've checked in multiple browsers (Chrome, Firefox, Safari).

Separately, I'd also like to know if there's a way I can make the header a link to the homepage of the site.

Here is my CSS:

#header {
position: relative;
top: 0;
background: url('http://ladyaandmischu.files.wordpress.com/2012/11/klnheader1.jpeg');
width: 975px;
height: 180px;
margin: 124px;
margin-top: 0;
margin-bottom: 0;
}

The site isn't launched, but so I've set a temporary password:

name: kidlitnetwork
password: thisisapassword

Any help would be greatly appreciated! Thanks,

Michelle