|
|
Posted by Martin Clark on 09/30/47 11:42
I am developing a new design for a canal society website.
The look I am attempting to achieve can be seen here:
http://www.tamevalley.freeserve.co.uk/hcs/index.htm
This has been achieved easily using tables for layout.
However, I am mindful of the current thinking that CSS should be used
for layout rather than tables.
I have managed to get as far as this using CSS for layout:
http://www.tamevalley.freeserve.co.uk/hcs/index2.htm
There are four problems I would appreciate help with:
1) The society's name in the header section appears at the bottom of the
dark blue header box, whereas I want it to be vertically central. I have
used vertical-align: middle; but I think this only affects images rather
than text.
In IE6, the text sits on the white line at the bottom of the box. In
Firefox it partly disappears behind the navigation bar. In Opera it
partly overlaps the navigation bar.
How can I get the text to appear half-way up the dark blue header box?
2)How can I get that same text in the header box to wrap onto a second
line in smaller windows (such as 800 pixels width), rather than overlap
the photo on the right? I would like to keep the white text in the dark
blue area only (as happens in the tables version).
3) In Firefox, the white area for the page's content overflows from the
"container" and covers the background colour to the right of the page.
This does not happen in Opera or IE6. How can I avoid this happening?
4) I only want the background colour to be visible to the left and
right, as happens with the table layout. Using CSS, the background is
also visible at the top and bottom.
I have set .container {margin: 0 3% 0 3%;} but this doesn't achieve what
I want. Any suggestions, please?
The pages have been validated and show no errors.
Most of the links on the page do not yet work.
Any assistance or pointers will be gratefully received.
--
Martin Clark
Navigation:
[Reply to this message]
|