|
Posted by GTalbot on February 28, 2008, 7:40 pm
Please log in for more thread options On 25 f=E9v, 11:41, jonlar...@gmail.com wrote:
> Hi all,
>
> (Apologies for any cross-postings)
>
> I am having an issue with a navigation bar in firefox. At seemingly
> random times, the nav bar will not appear in 1 line (as it should),
> but will span 2 or more lines.
>
> For example:
> How the nav bar should look:http://www.bostonhistory.org/img/menu/menu_OK.=
jpg
> and how it sometimes appears:http://www.bostonhistory.org/img/menu/menu_er=
ror.jpg
>
> I cannot reproduce this error on demand. If you click around the nav
> bar a bit on the actual site (http://www.bostonhistory.org/), you will
> probably be able to reproduce the error, but it seems to be randomly
> that it happens. We haven't seen this error at all in IE.
>
> The CSS to display the nav bar is here:http://www.bostonhistory.org/css/na=
v.css
>
> And the html is here:http://www.bostonhistory.org/inc/nav_code.phpp
>
> I'm not really sure where the problem lies with this. I've tried a
> few things with no luck. Anyone have any ideas? Anyone seen an issue
> like this before? (not the browser-compatibility issue, I know we've
> all seen _plenty_ of those :)
>
> thanks in advance,
> jon
> jlar...@tdcorp.org
You should first start with markup and css validation:
140+ errors:
http://validator.w3.org/check?uri=3Dhttp://www.bostonhistory.org/?s=3Dneighb= orhoods
http://validator.w3.org/check?uri=3Dhttp://www.bostonhistory.org/?s=3Dlibrar= ymuseum
http://jigsaw.w3.org/css-validator/validator?uri=3Dhttp://www.bostonhistory.= org/?s=3Dneighborhoods
I checked your css rules and css declarations and you definitely over-
excessively code, declare, define, etc.. Your css code is way too big
and way too over-constraining, everywhere, also pixel-precise
constraints everywhere.
First start with validation and then try to remove CSS declarations
and CSS rules, not add.
HTML 4.01 spec: http://www.w3.org/TR/html401/ validator: http://validator.w3.org/ CSS 2.1 spec: http://www.w3.org/TR/CSS21/ validator: http://jigsaw.w3.org/css-validator/ Why We Won't Help You:
http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you
=2EBodyText {
font-size : 0.8em;
font-family : geneva, verdana, helvetica, arial;
}
This is a serious mistake.
"Avoid sizes in em smaller than 1em for text body, except maybe for
copyright statements or other kinds of 'fine print.'"
W3C Quality Assurance tips for webmasters:
Care with Font-Size
http://www.w3.org/QA/Tips/font-size
Truth or consequences in web design:
Font-Size
http://pages.prodigy.net/chris_beall/TC/Font%20size.html
Regards, G=E9rard
|