Topic: css question (layout) Pages that link to <a href="https://ozoneasylum.com/backlink?for=11050" title="Pages that link to Topic: css question (layout)" rel="nofollow" >Topic: css question (layout)\

 
Author Thread
Gweilo
Bipolar (III) Inmate

From: switzerland
Insane since: Sep 2002

IP logged posted posted 09-18-2003 20:53 Edit Quote

hi,
I just started to learn CSS, so these questions might be trivial for you guys. I'm trying to do a layout for my website, only the bottom bar doesn't fit with the menu on the left hand side. It should be pushed down. Here's an example http://www.3d-community.com/layout/
I think it's because the menu is floating? Any suggestions?

Second Question: How do i do z-index with relational (not absolute, wasn't sure if relational was the correct word) layers? I know, z-index only works with absolute layers, but is there an other possibility to do this? I'd like to have the headmenu clip the title a little bit on the bottom (yes, in IE it's clipped, but in other browsers the title is in front of the headmenu). I tested that in Opera and Mozilla.

Thanks for your help!

ozphactor
Maniac (V) Inmate

From: California
Insane since: Jul 2003

IP logged posted posted 09-18-2003 21:16 Edit Quote

Add "clear: both" to the footer div. The "clear" property tells which sides of the div that floated elements are not allowed to appear. So the div will be pushed down, out of the way.

As for z-indexing relatively positioned elements, I don't think there's a way to do that with CSS.

Gweilo
Bipolar (III) Inmate

From: switzerland
Insane since: Sep 2002

IP logged posted posted 09-18-2003 21:31 Edit Quote

Cheers, clear:both; worked perfectly!

The thing with z-index: I think it should be possible, because on http://www.deviantart.com (that's where I got the idea from) they have exactly that, onlc the CSS code is way to complicated for me to comprehend.

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 09-18-2003 21:42 Edit Quote

At deviantart they used a nice workaround to get the z-indexing effect:

code:
h1 {
height:.95em;
overflow:hidden
}



The trick is to set the height to less than it would usually be and then have the remaining part cut off with "overflow: hidden;".

Gweilo
Bipolar (III) Inmate

From: switzerland
Insane since: Sep 2002

IP logged posted posted 09-18-2003 22:22 Edit Quote

Thanks! worked perfectly



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu