Log in

No account? Create an account

Previous Entry | Next Entry

SOLVED: header difficulty community page

  • Sep. 24th, 2006 at 3:37 PM

I am replacing the header on my community kawaiidownunderand only half of it displays and the original header still shows underneath. This comm is a plus account using the butterflies theme. Check my screen cap below:

the code i used was #header-inner {
background-image: url(http://img207.imageshack.us/img207/69/headerwa0.png); }

this is the only custom code used on the layout.

Thanks in advance for any help :)


( 15 comments — Leave a comment )
Sep. 24th, 2006 04:35 am (UTC)
There's a second header image that you need to override, even if all you do is assign a filename that doesn't exist, or leave blank. Should be #header if I'm reading the css correctly. I'm not sure why expressive uses multiple images to do the header with.

Anyways, for clarity, add this, and this should do it:

#header { background-image: url(blank.gif); }

...thought it doesn't really matter what you put there, it'll just not show an image. You can always make a 1x1 transparent gif if you're worried about older browsers or stupid browsers putting a broken image icon for your background, though I know Firefox and other smart browsers don't do that. You could also try putting your background image into #header, and putting the blank into #header-inner.

Either way, I hope that helps. :)
Sep. 24th, 2006 04:49 am (UTC)
marvellous! thank you for your help! :)
Sep. 24th, 2006 12:10 pm (UTC)
I'm sorry I am commenting to somebody else's entry, but I have the same problem and it doesn't work this way... ;(
I still have this cloud image from the default Bunnilicious header showing on my new header.
Sep. 24th, 2006 12:22 pm (UTC)
yours has an additional image in the code i think it's called header-photo. so you need to make that one dissappear too. try adding

#header-photo { background-image: url(blank.gif); }

in there too
Sep. 24th, 2006 12:29 pm (UTC)
It doesn't work, too... or maybe I'm adding it to the wrong place in the code?!

Sep. 24th, 2006 12:38 pm (UTC)
change that one to #header-photo-inner { background-image: url(blank.gif); } and try?
Sep. 24th, 2006 12:54 pm (UTC)
It still appears... :|
Sep. 24th, 2006 04:55 pm (UTC)
You seem to have changed your style to something other than expressive, so I can't see what's going on. I do see that emanate_art tried to help, did you give up when you didn't have any luck?

If you'd still like my help, I'll have to be able to look at your source code/css. Switch your style back to what you need the help with, then comment to let me know you'd still like my help. I'll see if I can figure out what you need to do.
Sep. 24th, 2006 06:28 pm (UTC)
Thank you very much! :-)
Yes, I changed it to Opal Libra, because despite all a cloud from the default Bunnilicious picture was still showing from underneath.

Here are my codes so far:

#header-inner {
background-image: url(http://img92.imageshack.us/img92/9709/totoroheadercopypp3.jpg);

#header-inner {height: 400px; }
#header { background-image: url(blank.gif); }
#header-photo { background-image: url(blank.gif); }
#header-photo-inner { background-image: url(blank.gif); }

#header-name { display:none; }
#header-description { display: none; }
.nav { display: none; }
Sep. 24th, 2006 07:29 pm (UTC)
Okay, the little cloud was being a trixy little image, and it was hiding within #header-content, if you add a background-image: url(blank.gif); for that also, you should be good.

Also, a tip for keeping your css looking clean, you can combine multiple classes and such into one entry when they have the same formatting, like this:

#header, #header-photo, #header-photo-inner, #header-content { background-image: url(blank.gif); }

Just make sure you don't lose the commas, otherwise you'll be making the browsers thing that you only want the style applied to that particular nested combination of classes. That should fix it though. :)
Sep. 24th, 2006 07:34 pm (UTC)
Wow... thanks muchly! ^_^ It works now! =)
Sep. 24th, 2006 11:14 pm (UTC)
Just to let you know, I used the Firefox extention CSS Viewer to find what class or ID has been assigned to a particular element. It's an awesome tool, and can sometimes save you time, unless there's a lot of nested classes and IDs controling the particular thing you're looking to change.

Glad to have been a help though. :)
Sep. 25th, 2006 01:52 pm (UTC)
Thanks!! =) I'll try it out when I use Firefox... right now I'm using Opera and many say, that they have very similar systems.

And thanks so much again, I'd never figured that out on my own. ^^;;
Oct. 21st, 2006 07:43 am (UTC)
Thanks for this tip! I could see my header in Firefox, but Opera was refusing to display it and this fixed it up completely.
Apr. 13th, 2008 02:14 am (UTC)
Hi, I'm really sorry to jump in on the discussion - I'm trying to put a 900x200 header on my custom opal theme and I'm completely flummoxed. I'm not a pro, I actually got my template from another user, and I can't seem to make the header commands above work for it.

here is the code I'm working with:

if you can possibly help, I'd greatly appreciate it, though I understand if you can't. Thanks in advance!
( 15 comments — Leave a comment )

Latest Month

March 2016

S2 Help Communities


Powered by LiveJournal.com
Designed by chasethestars