ie6, opera7 & firefox1 problems

length, :hover pseudoclass & imorting .css

[jaybird]

i've got some questions.
i'm doing my site and i'm testing it at home (winXP)
i've got 3 browsers listed in the subject

1. i cannot make firefox load an external .css file
i've tried
<link rel="stylesheet" type="text/css" href="the.css">
in page properties firefox tells me that i've got such a link on my page but however the styles are not rendered.
@import url(""); or @import ""; provide no help.
if it is the mymetype which is wrong in the .css file header than a. what to do?
b. why does ie6 or opera render the styles?

2. i've noticed that px, %, em and pt units are slightly different. why?

3. i've done some kind of menu with :hover pseudoclass.
my menu is a column with two groups (div id=menu containing div id=fund & div id=journal).
Each of them contains some links.
In the stylesheet i've made smth like that :
#fund {height:19px; overflow:hidden;}
#fund:hover {height:190px;}
Both opera and firefox understood me and i've got a kind of dynamical menu with 2 groups each showing its content on mouseover event. But ie6 (damn still the most popular browser) does not expand these groups when i point with my mouse at them. But it knows the :hover pseudoclass, because it renders correctly some css about links changing their color.
what's wrong? does it really lacks the dynamical css height property?

ps. i've made some javascript and the problem is temporary solved but i do not like javascript for things css can do.

[createErrorMsg]

jaybird, welcome to WebmasterWorld!

i cannot make firefox load an external .css file
i've tried <link rel="stylesheet" type="text/css" href="the.css">

This could be a doctype problem. If you are using an XHTML Strict doctype, you'll need to close that <link> tag to make it valid. It's possible that FF could be failing to link in the stylesheet if this is the case. <Link> is a self-closing element, so the proper XHTML markup would be...

<link rel="stylesheet" type="text/css" href="the.css" />

i've noticed that px, %, em and pt units are slightly different. why?

Different from each other, or different between browsers? Obviously, being different units, they will be different from each other. If it's browser differences your seeing, in all liklihood it is only when using EM and % that you are seeing this. And explicit font-size set in PX should render identically at identical resolutions (note that setting font-sizes in PX and PT prevents users from resizing that text in IE browsers). % and EMs may render differently because the browsers use a different default size from which the relative size is calculated. You can get around this by explicitly setting a default size in PX, but this raises the issue mentioned above (no resizing in IE). I think this is an issue that is best let go. Trying to maintain iron control over something like font-size on a web site is rather like trying to catch mosquitos with a fishing net.

But ie6 (**** still the most popular browser) does not expand these groups when i point with my mouse at them.

IE supports the :hover pseudoclass only on <a>nchor tags, whereas other browsers support it for any element. To get a drop down menu functioning in IE, you have to use javaScript to mimic the :hover behavior. Search for an article called "Suckerfish Dropdowns" by Patrick Griffiths and Dan Webb. They provide a short js script at the end of the article that works to get IE into line.

cEM

[jaybird]

well i ought to say 'wow' to your system and the style and speed of reply.
no about my questions :
3. i've got it and i am already using javascript. thanks
2. i've noticed difference between px units in opera and firefox. i think i'll give you some pics to prove (^ no arguing till that moment
1. i'm not using dtd at all. the page is at my local machine and <link> or @import elements either cannot bring the stylesheet to firefox. i think it's because of the mymetype but am i able to change it in winXP on my local machine?

[createErrorMsg]

1. i'm not using dtd at all. the page is at my local machine and <link> or @import elements either cannot bring the stylesheet to firefox. i think it's because of the mymetype but am i able to change it in winXP on my local machine?

Have you tried adding one to see if it helps? I'm not sure about changing mime types. I've never had a problem getting FF to link to a stylesheet on a local or remote machine using valid code and a doctype.

Have you tried uploading them to a remote server and see if it works? That would tell you if it's something on your local machine, or something in your code causing a problem.

i think i'll give you some pics to prove

Actually, don't. The WebmasterWorld TOS [webmasterworld.com] prohibit posting personal urls, including links to test pages and screenshots.

Not sure what to tell you regarding font size differences using a fixed unit like PX. I suppose it's possible. I'd just say again that minor font differences should, IMO, be ignored. It's not worth losing sleep over something your users can change on a whim anyway.

cEM