PDA

View Full Version : Banner not showing up - what's wrong?


Kip
Aug-07-2009, 12:29 PM
I have read a ton of threads on the banner not working, but I don't think any of them apply to my problem.

Please help! Why isn't my banner showing up?

www.kipper.smugmug.com (http://www.kipper.smugmug.com)

I put this in the css:

#my_banner {
display: none;
width: 900px;
height: 150px;
margin: 0 auto;
background: url(http://kipper.smugmug.com/photos/613332094_DqeT2-L.jpg) no-repeat;
}
.homepage #my_banner {
display: block;
}


THANKS!!!

jfriend
Aug-07-2009, 12:35 PM
There are a couple problems. First, you need to insert

<div id="my_banner"></div>

into your custom header where you want the banner to be.

Then, you need to make sure the height and width in the banner CSS match the size of the graphic you linked in. The -M graphic you linked is 600x100, yet your CSS says 900x150 which means you get bad scaling happening. These two should match. Either link in a 900x150 image or change the CSS to 600x100.

If you want some space below your banner, add this line in red to your banner CSS:

#my_banner {
display: none;
width: 600px;
height: 100px;
margin: 0 auto;
padding-bottom: 20px;
background: url(http://kipper.smugmug.com/photos/613332094_DqeT2-M.jpg) no-repeat;
}

Kip
Aug-07-2009, 12:52 PM
you are the best!!!
THANK YOU SO MUCH

There are a couple problems. First, you need to insert

<div id="my_banner"></div>

into your custom header where you want the banner to be.

Then, you need to make sure the height and width in the banner CSS match the size of the graphic you linked in. The -M graphic you linked is 600x100, yet your CSS says 900x150 which means you get bad scaling happening. These two should match. Either link in a 900x150 image or change the CSS to 600x100.

If you want some space below your banner, add this line in red to your banner CSS:

#my_banner {
display: none;
width: 600px;
height: 100px;
margin: 0 auto;
padding-bottom: 20px;
background: url(http://kipper.smugmug.com/photos/613332094_DqeT2-M.jpg) no-repeat;
}