'tabs' look in CSS

[bulge]

Ahh the wonders of CSS continue.
Simple question (I hope):

I have a <h4> heading 30% wide (which I want to be a 'tab').
Right below it I have have a <div>-styled box 100% wide (containing
lotsa text).

I have a border around both of them, 1px. They are lined up directly
under each other perfectly already (no gaps).

Problem: The top-border of the 100% wide div box is slashing through
my 'tab' just above it, ruining the tab effect I want. I still want
the top border to be there so it looks normal where the h4 'tab' and
the box don't meet, but to disappear where they meet.

Any ideas?

 

[Webcastmaker]

Any ideas?

Any URL?

 

[rf]

bulge

Ahh the wonders of CSS continue.
Simple question (I hope):

Not really, a couple of tricks are required.

I have a <h4> heading 30% wide (which I want to be a 'tab').
Right below it I have have a <div>-styled box 100% wide (containing
lotsa text).

http://users.bigpond.net.au/rf/tab.html

 

[bulge]

bulge


Not really, a couple of tricks are required.

http://users.bigpond.net.au/rf/tab.html

Seen it, thanks... but see that 'lotsa text' bit? I need it to be
bordered (top, right, bottom, left), except without slashing the
'active tab' bit with its 1px top border when it encounters it.

Is that possible?

 

[bulge]

Any URL?

I need to look into a free web host soon...

 

[rf]

bulge

Seen it, thanks... but see that 'lotsa text' bit? I need it to be
bordered (top, right, bottom, left), except without slashing the
'active tab' bit with its 1px top border when it encounters it.

It is. I don't know what browser you are using but here is a shot of that
page in IE6
http://users.bigpond.net.au/rf/tab.jpg

Is that possible?

If the above is not what you want then I have no more guesses left

 

[bulge]

bulge

It is. I don't know what browser you are using but here is a shot of that
page in IE6
http://users.bigpond.net.au/rf/tab.jpg


If the above is not what you want then I have no more guesses left

I tried Opera & Firefox...no borders Just tried IE, yep...they
show up. Thanks for the help, I'll see if I can hack my way around
this (it must work in all moderm browsers).

 

[rf]

I tried Opera & Firefox...no borders

There was a typo that crept in *after* I had checked the page in Mozilla.

 

[bulge]

There was a typo that crept in *after* I had checked the page in Mozilla.

ahh, typos. I know them well
Looks good in Moz, but bad in Opera.

This is the most annoying thing about web-work - every browser does
things differently. Gah! I just find I got a spacing issue in IE 5.x
too...

Might post the page later. Break time now. Eyes popping out...

 

[brucie]

in post: <

http://users.bigpond.net.au/rf/tab.html

broken in opera until you add 'margin:0;' before 'margin-right:10px;' in
the h4 or do a margin:0 10px 0 0;

 

[rf]

in post: <

broken in opera until you add 'margin:0;' before 'margin-right:10px;' in
the h4 or do a margin:0 10px 0 0;

Thanks brucie.

But, how stupid is that? Opera is not a browser I support anyway

 

[brucie]

in post: <

Thanks brucie.
kissy

But, how stupid is that?

its a gowd damn catastrophe! someone should be poked with a pointy stick

Opera is not a browser I support anyway

i know you're just teasing me

 

[Sid Ismail]

: Problem: The top-border of the 100% wide div box is slashing through
: my 'tab' just above it, ruining the tab effect I want.


Quote a URL. It's the padding you have that does that.

Sid