DIV overflow and borders are screwy

[Wayfarer]

I'm stumped. Would one of you take a look at the following site and
help me with two problems:

1. When zooming in, <div id="banner"> is the *only* block that doesn't
"expand" to fit the text & image.

2. Viewed in Firefox, Netscape and Opera, the borders for each menu
selection don't go all the way across (you'll see what I mean, I hope),
though it looks OK to me in IE 6.

The page to test is at http://wayfarer.brinkster.net/wcts/index.htm, CSS
is at http://wayfarer.brinkster.net/wcts/wcts.css. Only this page and
the CSS have been validated.

TIA

Neill

--
Wayfarer
Journeys: http://wayfarer.brinkster.net/contact.asp

[Neal]

On Mon, 25 Oct 2004 23:19:14 -0400, Wayfarer <we*****@bottom .com> wrote:

I'm stumped. Would one of you take a look at the following site and
help me with two problems:

1. When zooming in, <div id="banner"> is the *only* block that doesn't
"expand" to fit the text & image.
In IE view - largest won't affect images. Page is fine here.

Try zooming in Opera, it's a mess.
2. Viewed in Firefox, Netscape and Opera, the borders for each menu
selection don't go all the way across (you'll see what I mean, I hope),
though it looks OK to me in IE 6.

Simplify a test case and post a URL. This is too complex to sort out.

[Lauri Raittila]

Wayfarer wrote;

I'm stumped. Would one of you take a look at the following site and
help me with two problems:

1. When zooming in, <div id="banner"> is the *only* block that doesn't
"expand" to fit the text & image.
Most likely, you have some floated content there. Floats are taken out of
the flow. Float only the dove and give your box min-height so that dove
fits.
2. Viewed in Firefox, Netscape and Opera, the borders for each menu
selection don't go all the way across (you'll see what I mean, I hope),
You have some mistake somewhere, unsurprisingly. Replace 155px with 165px
where you should. Also notice, that it is BAD idea to use px when
measuring text.
though it looks OK to me in IE 6.
That is irrelevant.
The page to test is at http://wayfarer.brinkster.net/wcts/index.htm, CSS
is at http://wayfarer.brinkster.net/wcts/wcts.css. Only this page and
the CSS have been validated.

body {
font-weight: normal;
margin: 3px 3px 3px 3px;
}

First is not necessary, second shortenable

a:link {
color: #A51BAE;
}

Define background color with your color

p.sm {
font-size: 80%;
font-style: italic;
}

This paragraph should be readable. 80% + italic makes it unreadable for
most people.

#footer {
font-size: 65%;
}

If something is not meaned to be read, it is not worth putting in stie

#menu {
left: 0px;
position: relative;
padding: 0;
margin: 0;
font-size: 80%;
background: #ffffcc none;
}

These are either unnecessary or harmful.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>