Layout problems

[kyllle]

Hi all,

Iv created the following .jpg http://fc02.deviantart.com/fs32/f/2008/234/a/b/testersss_by_kyllle.jpg which Im trying to replicate using html & css, Iv tried to poition the buttons etc at the top but having trouble inserting the text below the sub vavigation and also having trouble making the left navigation appear one below the other like intended in the .jpg, Iv added text in to were I hope to place the orange background but nothing seems to look right, were am I going wrong?? please advise as this is really getting to me!!

current site http://www.glen-lodge.co.uk/testing_arena.html

Kyle

[kyllle]

I have been trying to sort out these problems and I am making some head way although I was wondering if anyone could point me in the right direction with the following problems

1) how can I add the little piece of text on the right hand side under the sub nav links??
2) the buttons down the left column view great in ie but in firefox they dont seem to show any gaps between, what seems to be causing this
3) how do I add the footer to the bottom of the page

your time is appreciated, im really trying to get ontop of this!!

Thanks again!!

Kyle

[omol]

1) Wrap in a div and postion it as relative. Use the top, left, bottom and right css properties to postion this.

2) It's a bug in the way ie renders. Theres load of work around for this. try repeating using !important infront of the elements id and using line-height rather than padding to postion the elements.

3) Again postion.

postion: absolute; bottom: 0px;

[MidiMagic]

IE renders surrounding styles (margin,. border, padding) inside defined widths and heights. This is nonstandard behavior.

Other browsers put the surrounding styles outside the widths and heights.

The trick is to nest two tags, one with the surrounding styles, the other with the sizes. Then, they render the same on both kinds of browsers.