[animgirl]

Okay, I think I have an example that may clear what I was trying to suggest for that header:
Let's say I have this section in my header, but need the two sections on independent layers. (The red layer being the one that would be repeating in the background.):


Instead of taking the red out and making it look like this because of the blue's transparent values...:


I could fake it by leaving some of the repeating red background on the end of the blue section like this which would be 1 layer, and then the red would repeat beyond that:


It might work.
animgirl

[Redcap]

I follow (I think), but cannot get my copy of Fireworks to comply, darnit. I've put out a call to the HWG graphics list for help as well (a year of so back, there was a damn good Fireworks 3 guru there), but nothing has been forthcoming as yet.

In the mean time, I'll be concentrating on the css-p and html.

Thanks for the thought, though!

[animgirl]

Now, as to the menubar. Can I take it as read that a div right below the masthead div (without the absolute positioning, of course!) will be flush, with no 'white space'?

yes

[Redcap]

Nope; that damnedtowherever footer was completely invisible with no positioning attribute, and again over the masthead with e 'ralative' one. Back to flamin' square one again.

Lord, this is trying me badly. I mean, why the heck is the text div in the right place, and the footer being bolshie? I am completely, inconditionally, stuffed up with brainache over this inconsistency.

[Redcap]

Originally posted by animgirl

yes

OK, good, thanks. So, when we've solved the brainache over the footer, we can suffer more lost sleep over the menubar. (sigh).Oh, well. Nothing worthwhile is ever without pain, or something. I'm off to beat my head against a wall, or something.

[animgirl]

This could be silly, but why did you make the footer position:relative? and not absolute?

[Redcap]

Well, first I tried absolute, as you did with the #text. No joy: right at the top, over the masthead.

Next, I tried relative, reasoning that it meant that it's be relative to the previous div box, i.e., right below it. Nope, same result.

Then, I removed the positioning attribute, on DC's suggestion. The damn thing disappeared from the screen completely. Talk about X-File behaviour.

Wait one: let's see if 'fixed' does anything (last chance... back in a mo or three...)... nope. Invisible again.

What IS it with this damned CSS-P - is it TRYING to get me to have a nervous breakdown or something? It seems to be defying all bleedin' logic! [EXASPERATED]

As to a nap: I'm due on-shift at 09:25. I'll get up at 07:30. It's currently 21:31. I'll hit the hay at around 00:00, or I'll get up WAY too early. But thanks for the sentiment: It's appreciated!

[animgirl]

I'm experimeting with it right now.

I think what's going on is that because the header's position is absolute, that the rest of the body of the HTML does not see it, and that's why we always have to specifically position the text a certain px from the top. But, the elements in the header do not align correctly when on another position property. Because, if the header was fixed with another position property, then you wouldn't even need position properties for the text and footer, and it works. When the position is set to absolute, things are positioned at 0,0.

So, that's what I'm working on.

[animgirl]

doh... I think I fixed it.

Change the header position to relative and take out the position properties for the text & footer and it should work.

NOTE: mybad, you should take out the "/" in the sections where there is " />"; those are xhtml attributes.

[Bri]

Interesting effect!

On my 15.5" SXGA laptop screen (1400x1050), the header has a small gap in it: (I will try and see if I can attach a screen shot of it here ... It is just to the left of "Airsoft" if this fails.)


Hope that is helpful.

Bri

[animgirl]

That does help, thanks!

#tracer-spacer {
	display:block;
	position:absolute;
	border:0;margin:0;padding:0;
	width: 75%;
	left: 100px;
	right: 0%;
	z-index:0;
}

Just change the width to 75%, that should fix it.

[Redcap]

Thanks. It'll be amended in the next couple of hours.

Next up, DC - I've got your e-mail, and will be looking over the code this evening (it's currently 19:45 here in London, UK). Thanks!

[Redcap]

Righty-ho, then. We've moved on... HTML4.01 has been replaced, at DC's advice (thanks, David!), with XHTML 1.0 Transitional. Also, the '#footer' div now goes *within* the '#text' div, in order for it to appear in the right place. So damned simple a fix I should have thought of it (within the '#text' div, I mean!).

The tracer-spacer gap solution given by Animgirl has also been executed, and is in place (thanks!).

So, while I wait for a Fireworks 3 graphics guru to solve the transparency problems mentioned earlier, I'll move on a little, and work on the various floating box div placements. Which should proove... interesting...!

Oh, and if anyone can figure out why the hell that damned javascript menubar is spacing itself so far away from the masthead, I'd appreciate it! If it's just a case of removing the div it's in, then so be it, and I'll have to figure out a way for it to be centred some other way!

[animgirl]

Your nav is positioning itself the way it is because in your CSS you have the top positioned at 150 px from the top. You can change that.

As far as the header goes, I've got to try this again... to see if you understand; it's kinda hard to explain.


Okay, the brighter section outlined in red labeled as the "mappy section", that's the mappy part. It seems to me that you just took that part and tried to make the edge transparent so that it would fade into the separate layer mossy background.

What I am suggesting here, is to instead LEAVE some of that mossy background on the EDGE of the mappy section, and do not have any transparency.


Then, it will appear to be fading into the mossy background, but a small section will actually be fading into the mappy background on the same layer.

I hope that helps...

animgirl

[Redcap]

Originally posted by animgirl
Your nav is positioning itself the way it is because in your CSS you have the top positioned at 150 px from the top. You can change that.

Gotcha - thanks! Top changed to 116px - sorted!

Re the header transparency: yep, I follow. Problem is my level of competence with Fireworks is so lacking in this situation, that I've been unable to solve it. I'm gonna give this some hefty thought, and try and figure out a fix. It may take a while, darn it, but I'll get there, somehow!

[animgirl]

COOL!

What's next?

[Redcap]

Adding the "what, no drop down menu?!" text link under the menubar, recolouring the menubar to suit the colour scheme, adding some background to the menubar div at 100% width, adding the Amazon Associate sales boxes (an iframe within a CSS-P div box) on the left of the page, re-doing the scrollbar colours to suit the colour scheme, and the rest of the tasking listed on the beta page!

Then, of course, there's that damn masthead transparency issue...!

Once all *that* is accomplished, cross-browser testing, and content migration. And THAT is gonna be just a pure, hard slog. Not to mention the fact that over two dozen table layouts are gonna have to be ported to XHTML/CSS boxes in various pages of the content.

Would someone remind me why I took on this task in the first place? I must be completely outa my tiny mind!

Edited for telling sperrors!

[Redcap]

WHOA! I just made 'Senior Member'!

What's a "Senior Member"?! No, don't answer that one!

[Redcap]

Right, then - done so far this evening, in addition to the above (my, but haven't I been busy, lol):

• Re-coloured the menubar to suit the colour scheme
• Added background colour to the menubar div
• Re-coloured the scrollbar colours to suit the colour scheme

Next up in the immediate future:

• Adding the Amazon Associate sales boxes (an iframe within a CSS-P div box) on the left of the page
• The rest of the tasking listed on the beta page!

And now, it being 00:22 here in London, I'm off to bed - good night, all!

[animgirl]

Hey,

Congrats on becoming a senior member!

You've been a workin' on that site.. it's lookin' good. Just that header... it's...it's... driving me nutZ. {eye twitch}

Anywho, I guess i'd have to see your old site to know what you are talking about on the other thingie.

Get some sleep, you've had a roller coaster ride today!

EDIT: I see what you're talking about and am experimenting with it.

animgirl