Home discussions products about writing Projects

Open Source for Collaborative Knowledge Development and Learning

Note: This site's content is accessible to all versions of every browser. However, this browser may not support basic Web standards, preventing the display of our site's design details. We support the mission of the Web Standards Project in the campaign encouraging users to upgrade their browsers.


Blog Entry [details and replies]

KNotations :: Documentation and development plans from the KnowNet development team Weblog 84 entries 23-June-2006 1 authors
show or hide details for this item ironing out the IE/Windows CSS wrinkles, part 1423 Blog Entry 0 replies 01-December-2004 Mike Malloch
Kind:
Blog Entry
Created:
01-December-2004 12:13:31
Last Updated:
01-December-2004 12:31:25
Author:
Mike Malloch
Status:
visible

Continuing the discussion...

Listed below are links to (1) weblogs or discussions that reference this item:
Yet another few hours wasted hacking workarounds for CSS flaws in Internet Explorer for Windows...

Yup. It was time again to review the behaviour of some new stuff in what the folks in the NGRF site-development team have come to call My Favourite Browser. And, of course, there were problems where glaring bugs in IE's implementation of CSS conflicted with our attempts to use terse semantic markup and pure-css layouts.

This time around, there were problems with the display of listed embedded discussion summaries, the default style of our weblogs, and with with the convenience pretty-floating images for teamtask decoration - in each case, clean semantic markup and straightforward styling ran across bizarre flaws in IE's rendering engine.

listed embedded discussion summaries - disappearing text
(These appear optionally in any indexFolder render; tersely showing the most recent discussion items from anywhere within the subcontent). This was another case of the weird 'disappearing text' bug, which can be worked around by setting a height:1% explicitly for content which has a clear implicit height of its own. Took us hour to hunt down that fix some time ago; thank heavens we remember it :O) There is still some odd behaviour in these lists - which are just a series of a's - because the links are given little icons as bg images, and IE for some reason behaves very badly with css bg images and hover's... some versions attempt to fetch the image repeatedly, for instance, so there is a noticable flicker when hovering even though the :hover styling does not change anything about the background-image... sigh.
default style of our weblogs - h1 in the context message caused left-styled sidebar to clear beneath main content
The default style for knotes weblogs - which I do know needs a lot of work and rationalising - places the sidebar div at the left of the main blog content with css. Somehow, the h1 in our context messages when viewing categories etc caused this to clear so that it appeared beneath the main blog content. Changing the h1 to an h3 worked around this. We also tuck the blog into a maximum width of about 900px in that style, so that a banner image runs across the top, and so that the main blog text stays within readable em-widths without having to hack 'p' etc tags to get readable widths in IE/win. Blinking 'eck, I forgot to apply the javascript expression workaround for max-width to the blog-content wrapper class... so it was displaying across the width of the page and looking very peculiar. Why-o-why can't a company the size of Microsoft manage to implement a simple and standard property like max-width? We also had to use an expresion hack to effect the centering of the wrapper div in the page...
pretty-floating image for teamtask decoration - the dreaded float against dl bug
For the main seed-content of team tasks, I have a few little utilit classes which give the decoration images nice frame-like borders and float them left or right. When these render next to the dl's for embedded discussion topics, they 'cut off' so that the area of the image which would have been shown from about 10px below the top of the next-door dl just disappears. The dl content and it border clearly appear to stop before they 'get to' the floated image... but something causes the image to disappear below that imaginary line :O( Ended up having to get the dl class to clear both in ie (again using the expression hack for branching)...

Why do developers have to waste time we could be spending on functionality fiddling to work around bugs in this notorious browser? Why can't MSoft at least offer some updates to fix these bugs and complete their implementation of css? Why don't users everywhere revolt and Get Firefox?

Getfirefox

Comments please

If you are already registered here, please click the "Login" button to send your username/password with the comment. Click the "Anonymous" button to leave a comment without logging in.

Please tell us who you are

E-Mail Address (Required)
We need a valid email address in order for you to post a comment. You will recieve an email containing a special validation link. The comment will not be published until validated
Name
Please leave your name
Title
Lead-in
Body Text ( HTML tags are allowed )
Validation
Please enter the text from the image above
Preview your comment