GetSimple Support Forum

Full Version: How to add image header to top of page
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I just want to have my clubs image logo across the top of the pages. In other CMSs I've replaced the header_bg.jpg with what I want but I don't know if that will work with GS. I'm sure it's super easy but for a newbie a suggestion would be much appreciated. Thanks!

BTW, I'm using the default template!
You can edit the stylesheet of the default theme to replace .logo with the image and hide .tagline
Thanks Chris
I tried that but it seems it was resized and centered. I would like the full horizontal width of my browser used for the image.
This is what I used -

#header {
position:relative;
height: 200px;
margin: 0 auto;
background: url(images/bee1260x129.jpg) no-repeat top left;
}

How can I get it to be full horiz width?

Thanks
Tony
tyee Wrote:Thanks Chris
I tried that but it seems it was resized and centered. I would like the full horizontal width of my browser used for the image.
This is what I used -

#header {
position:relative;
height: 200px;
margin: 0 auto;
background: url(images/bee1260x129.jpg) no-repeat top left;
}

How can I get it to be full horiz width?

Thanks
Tony
drop margin: 0 auto;
and add
width:100%;
maybe?
add
background-size: 100%;
to header styles

Unfortunately this is a css3 property, and not all browsers will recognize it.
your image seems to be 1260 width by 129 height, right?

and you say "your browser", you should think of "your monitor" and those of others.

So what with monitors which have bigger resolution, for example 1980 x ... ?

that's why the image should be centered with margin:auto

Webcontent is not like print-layout, it is not fixed with fixed size and fixed height etc.