CSS not working in IE6
Tom Burton
first css website, slowly I am getting into it, understanding the code etc.
I have cheated and used a horizontal drop down menu from www.tanfa.co.uk,
the pages I have created are here. Worry not about the colours and missing
pictures etc.
http://www.tugtracker.co.uk/xpress9wnxx-help
Now the problem is (as any IE6 users will have noticed) is that the links
from the menu bar don't work!
With other browsers -firefox and Opera I get it displaying just as I
intended.
(sorry about the pink guys!)
The code I borrowed is supposed to have this problem licked...
Any ideas?
Andy Dingley
wrote:
> I am very new to CSS and am using Microsoft expression web
> http://www.tugtracker.co.uk/xpress9wnxx-help
Thanks for posting, it's interesting to see what M$oft Excression
produces.
The code is fairly untidy and you need to sort out the various
invalidities that have crept into that before you start worrying about
the CSS.
* You're using XHTML Appendix C, so stop that and switch to HTML 4.01
Strict
* You're using Transitional, so stop that and switch to HTML 4.01
Strict
* Your markup has various dead tags lying around in it (</span>
mainly) so get rid of the stuff that isn't meant to be there and is
just left over from dead edits. Did you edit this in a "HTML code
view" mode, or purely with WYSIWYG?
* You've got three CSS stylesheets attached here: one internal, one
external and a 2nd external that's imported into the first. This is a
far from simple scenario for any CSS beginner to try and work with!
Replace all of them with a single external stylesheet and get it
working first! Count the conditionals and you have 5 stylesheets.
* Even with this "CSS layout", there are style sttributes on HTML
elements with explicit positioning in pixels. Any "web" editing tool
that generates this sort of markup is a bad tool and best avoided (see
the Freeway thread).
* There are conditional comments in here "<!--[if lt IE 7]>"
These have _no_ place in any page that a CSS beginner is trying to
work with and understand. They're not necessary and they're certainly
unhelpful. Get rid of them.
* I presume the M$oft crap like "verdana" has crept in during editing.
Overall I'm afraid "it works for me" on IE 7 and I don't have a 6
handy to see your problem. There's nothing obvious, but the CSS is
modified too far from the original example to blame that and now it's
too poorly structured to begin debugging it manually. Sorry.
Tom Burton
"Andy Dingley" <din...@codesmiths.com> wrote in message
news:1171640722.1...@a75g2000cwd.googlegroups.com...
No no don't be sorry,
I was just posting on a lunch beak and didn't post the full story.
Thanks for your comment, I should have said what you see is a very much a
work in process, well not even that, more a playing copy "what happens if I
do this and delete that" and after two days of chopping that's the messy
result! T know about the tags and what not..
I just got to the point where I was going GRRRRR!
I very much apriciate your comments and will play some more, curiously as
with the FrontPage Bloat. MS Ex created the three Stylesheets with the
template I borrowed.
I think I shall await my book and be patient rather than getting myself more
confuddled.
Tom
John Hosking
> [...]
> http://www.tugtracker.co.uk/xpress9wnxx-help
>
> Now the problem is (as any IE6 users will have noticed) is that the links
> from the menu bar don't work!
> [...]
> The code I borrowed is supposed to have this problem licked...
All of what Andy says is true (well, not necessarily *always*, but in
his post to you, this time, yeah) and you should study his words. One
specific thing I noticed was the extraneous and premature </head> tag,
but that'd fall under his "invalidities" category.
More specific to your question, you need to know that IE6 doesn't
support li:hover, which is what you're trying to use to make your menus
work. Possibly your source for the code mentioned the restrictions with
IE6, and you overlooked it, but just as possible is that your source
didn't know. Hmm, I now suspect the former; on the page at
http://www.tanfa.co.uk/css/examples/css-dropdown-menus.asp. I see the
following text in a big, centered box:
"Microsoft's Internet Explorer (IE), however, does not support :hover on
anything except <a>, anchor, elements and also it's support for Child
Selectors is sadly lacking."
Turns out they have some tweaks, refinements, and workarounds for use
with IE, but I haven't bothered to read them all. That's *your* job...
--
John
Ed Mullen
I'm not certain, and I haven't really tested it, but, it seems tome that
the csshover.htc hack you've used doesn't seem to be implemented
properly. First off, there's no reason to use it for IE7, it's only
needed for IE6. I use the tanfa scheme on my web site (successfully
tested in IE6, IE7, SeaMonkey, and Firefox).
In IE6 the menu scrolls with the page, in Mozilla browsers it is fixed,
in IE 7 it acts as Mozilla browsers do, being fixed.
In a cursory look at your source, your .htc hack differs significantly
from mine (and the tanfa base example I used). You are testing for
differently for both IE 6 and 7. No need. Just test for IE6 and use the
same style sheets for Mozilla and IE7.
--
Ed Mullen
http://edmullen.net
http://mozilla.edmullen.net
http://abington.edmullen.net
I just love the French. They taste just like chicken! - Hannibal Lecter
Tom Burton
"Tom Burton" <thomas...@freezingcoldmail.com> wrote in message
news:6lmBh.4745$Fg4....@newsfe5-win.ntli.net...
>
> "Andy Dingley" <din...@codesmiths.com> wrote in message
> news:1171640722.1...@a75g2000cwd.googlegroups.com...
>> On 16 Feb, 14:54, "Tom Burton" <thomasburt...@freezingcoldmail.com>
>> wrote:
>>> I am very new to CSS and am using Microsoft expression web
Just for archiving purposes, I have been reading and learning much here
http://www.htmldog.com/guides/cssbeginner/
Tom
Tom Burton
- Now having loads of fun :-)
Thanks to "anon" for pointing out this site (via email).
Tom