header banner add-in?

[mutelorelei]

I just got a paid account and I'm looking forward to customizing things, but I'm not very familiar with CSS, though I do have some experience with HTML. I haven't seen a tutorial for exactly what I want to do -- I don't want to replace the header with a new one, I'd like to know how to put in a image banner *between* the header and where the

Comments

[av8rmike]

Huh. That's a new one for me. Maybe try some kind of styling on #header-decor like
#header-decor .decor {
background-image: url();
}and put your full image path in the parentheses. It'll probably require a bit of experimentation to get the right context.

[mutelorelei]

Simply putting in

#header-decor .decor {
background-image: url(http://h1.ripway.com/spikedlorelei/mutebanner3.jpg);
}

into Custom CSS has no visible effect, so I'm guessing I probably need to put in something to make space for it after the header, "padding" of some kind, either on the bottom of the regular header or on the top of the entries or sidebar part? Or should I try putting that stuff into header-decor? I say that because I'm guessing right now the entries are overlapping right over the banner instead of moving down for it.

(and I realize the banner color isn't quite matching the rest of the journal, I figure I'll try to see if I can get this to work at all, then fiddle with the banner to get it to look seamless and color-matched later)

[av8rmike]

Right, I figured out the ".decor" specifier isn't necessary... You'll want to add properties to #header-decor to look something like this:
#header-decor {
display: block;
background-image: url(http://h1.ripway.com/spikedlorelei/mutebanner3.jpg);
width: 900px;
height: 180px;
bottom: 0px;
left: 0px;
}where you'll want to change the width, height, bottom, and left to get it to look the way you want. You may also need to change the positioning of the base theme header image to keep it from getting moved around.

[mutelorelei]

It seems to be working.

Thanks so much for your help! :)