Experimenting with CSS

[szronik]

Hello Everyone!

I'm new here and although I've experimented with CSS a little bit, I consider myself a total novice anyway because I simply don't have a "feel" for CSS. I read a few tutorials, bought two books on CSS (Both Eric Meyer's) and I've created one or two web pages which work, but they're definitely not up to standards.

Anyway, let me get down to the point here. I am currently working on my home page and I've come across a problem which I have difficulty solving. Please take a look at the following page: http://eljefe.cba.pl

I need "sitemast" on top, and that's fine. Then I want the menu on the left and the content to the right of the menu. That works fine as long as I set positioning of "content" to absolute. Should I just create a margin on the left side of "content" because it's right under the menu right now. What I was hoping is that CSS somehow sees the other div objects and I can set their position in reference to each other, but I am utterly confused.

Actually, everything was fine with the absolute positioning set - until I tried to add another <div> with the footer. The footer appeared under "sitemast" Any input would be greatly appreciated.

Thanks in advance.

Pawel

[moojoo]

Assuming the menu is floated left then yes you would put a left margin on the content larger than the width of the left menu.

so if the left menu was 200px margin:0 0 0 210px;

[moojoo]

Since your left menu is floating you need to put a clearing div right above the footer so it remains below the menu despite the height of the content.

something like

.clearing {
height:0;
clear:both;
}

[szronik]

Thanks a lot for your help. I fixed it up a bit. It still isn't what I'd like it to be, but it's always a step ahead.

I set the height of "content" to 100% due to the fact that if I hadn't done that then if there isn't enough content in there the footer jumps just below it but it's still not below the menu. Not sure if setting it to 100% is a good idea, but it'll do for now.

Thanks again.

[ukgeoff]

Have a look at this template with explanation of what goes where and why that I put together a while back.

It makes a good starting point for any web site. You just take out any bits you don't need and adapt the others.

http://1ontheweb.net/downloads/Templates.zip

Curious editing issue. Although what you see on screen was correct, the underlying link that came up in the browser was not. This has now been corrected.

[minute44]

Setting Heights in percentages can be tricky. It's best used on widths.

It is best to not set any figure for the heights and let the content dictate that.

Yeah!!!! 600th Post!!!!!

[szronik]

Thanks, I'm gonna download it and have a look. Sigh, wish I had more time!

[szronik]

Just replying quickly to let you know that you should change the extension of that file. I tried unzipping it several times and then thought that maybe it's just .html or .css so I opened it up in BBEdit and it worked.

[szronik]

Originally Posted by ukgeoff

Have a look at this template with explanation of what goes where and why that I put together a while back.

It makes a good starting point for any web site. You just take out any bits you don't need and adapt the others.

http://1ontheweb.net/downloads.Templates.zip

Okay, third reply. The .zip file is actually an .html file so no CSS template here. Think you could repost?

TIA

[ukgeoff]

Try the link again. There was a '.' where a '/' should have been so I'm not sure what you got but it certainly wasn't what I intended.

The zip file contains 8 files. 1 .html, 2 .css, several .inc and an explanation in pdf.

[ukgeoff]

Link above has been inserted a new. See note.

Sorry for the hassle.