Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Re: IE6 has beat me up

Reply
Thread Tools

Re: IE6 has beat me up

 
 
Neil White
Guest
Posts: n/a
 
      08-06-2003
Hi all,

Thank you all for your responses.

-- The problem was (and still is...)
> In IE6 I get trailing text characters from <div>s in stupid places.
> Depending on the window size, this means the last two characters of some
> <div> or other are repeated on the screen in a different location.
> I use IE6(SP1) on Win98 on a 800x600 setting.
> The url is: http://www.nowpc.co.uk/nowpcNEWSITE/index.html


I've reworded the above a little to hopefully describe the problem a little
more clearly. I've worked through the points that have been raised in your
replies. There are now no errors or warnings on the W3 CSS validator.

http://jigsaw.w3.org/css-validator/v...nowpcstyle.css

However, the issue with IE6 remains. What a... curious quirk. Still, rather
than ignore it, as Headless suggests, I'd like to get rid of it. Am I faced
with completely restructuring the CSS to achieve the same layout, but using
different methods (e.g. positioning rather than float etc.)?

Thanks all again,
Neil


 
Reply With Quote
 
 
 
 
Neil White
Guest
Posts: n/a
 
      08-06-2003
Hi m,

>
> You might try commenting out sections of
> markup and sections of CSS to see which
> ones make the problem go away. Once you
> find the offending sections, you will be
> able to focus more clearly. Sometimes
> this works, sometimes it doesn't!
>


Interesting. Well, when I say _interesting_, of course what I mean is
laborious and tedious, but a very good idea. I'll get back to you...

Best regards,
Neil


 
Reply With Quote
 
 
 
 
m
Guest
Posts: n/a
 
      08-06-2003
Neil White wrote:

> Hi all,
>
> Thank you all for your responses.
>
> -- The problem was (and still is...)
>
>>In IE6 I get trailing text characters from <div>s in stupid places.
>>Depending on the window size, this means the last two characters of some
>><div> or other are repeated on the screen in a different location.
>>I use IE6(SP1) on Win98 on a 800x600 setting.
>>The url is: http://www.nowpc.co.uk/nowpcNEWSITE/index.html

>
>
> I've reworded the above a little to hopefully describe the problem a little
> more clearly. I've worked through the points that have been raised in your
> replies. There are now no errors or warnings on the W3 CSS validator.
>
> http://jigsaw.w3.org/css-validator/v...nowpcstyle.css
>
> However, the issue with IE6 remains. What a... curious quirk. Still, rather
> than ignore it, as Headless suggests, I'd like to get rid of it. Am I faced
> with completely restructuring the CSS to achieve the same layout, but using
> different methods (e.g. positioning rather than float etc.)?
>
> Thanks all again,
> Neil
>
>

http://www.xs4all.nl/~ppk/css2tests/

....this site knows a lot about IE
browser bugs.
HTH
m

 
Reply With Quote
 
Marc
Guest
Posts: n/a
 
      08-06-2003
> > You might try commenting out sections of
> > markup and sections of CSS to see which
> > ones make the problem go away. Once you
> > find the offending sections, you will be
> > able to focus more clearly. Sometimes
> > this works, sometimes it doesn't!
> >

>
> Interesting. Well, when I say _interesting_, of course what I mean is
> laborious and tedious, but a very good idea. I'll get back to you...


If you find a way to fix it for IE, you might consider making up a separate
stylesheet for IE, detecting the browser server-side, and then serving the
CSS dependant on the browser. This is what I usually do.

I can give more info on how to do this if you feel this might be a good
option?

HTH

Marc


 
Reply With Quote
 
Chris Morris
Guest
Posts: n/a
 
      08-06-2003
"Marc" <(E-Mail Removed)> writes:
> > Interesting. Well, when I say _interesting_, of course what I mean is
> > laborious and tedious, but a very good idea. I'll get back to you...

>
> If you find a way to fix it for IE, you might consider making up a separate
> stylesheet for IE, detecting the browser server-side, and then serving the
> CSS dependant on the browser. This is what I usually do.


Over-complicated. Just use one of the many CSS-hiding tricks that
work on IE.

/* everyone sees this */
p { font-weight: bold; }

/* IE/Windows doesn't see this */
html>body p { font-weight: normal; font-style: italic; }

/* or alternatively you could use this one if Mac IE is also a problem */

/* IE/Windows and IE/Mac don't see this */
p, [hideme] { font-weight: normal; font-style: 200%; }

> I can give more info on how to do this if you feel this might be a good
> option?


Using CSS selector parsing bugs to hide CSS property parsing bugs is
usually much simpler and more effective. And doesn't require any
server-side browser detection (which can be unreliable, especially
given the number of browsers that fake their UA as Internet Explorer,
but have different [1] CSS support).

http://www.w3development.de/css/hide_css_from_browsers/ has a whole
range of CSS-hiding methods for various browsers.

[1] Sometimes better, sometime worse. For that matter, Mac IE and
Windows IE have incredibly different CSS support, and Win IE5 and Win
IE6 are different in places too - the CSS hiding tricks let you be a
bit more flexible.

--
Chris
 
Reply With Quote
 
Neil White
Guest
Posts: n/a
 
      08-06-2003
Hi DU,

Can I first of all say thanks for your reply. Like many people here, I'm
learning, playing with ideas, so every reply is gratefully received, even if
it does, erm, knock me around a bit.

Du wrote:
> I have not examined your code a lot but a few issues strike me. I think
> you over-create containers in your code.
> E.g.:
> 1-
> <body>
> <!-- The main container for the page -->
> <div id="divMainContainer">
> <!-- The container for the left hand section of the page-->
> (...)
> </div>
> <!-- End of divMainContainer-->
> </body>
>
> Why not eliminate the div id="divMainContainer" and transfer its css
> declarations to the body? After all, isn't the body element the main
> container of a page's content?


I use the divMainContainer to create a surrounding border effect using the
body's background colour, and put a further 2px ridge border around the
container. I kind of like the effect, and it means that I can at some point
place a background image on the body, hopefully interacting with the
background image in divMainContainer. I also played around with the size and
positioning of the container as I can see then what happens to the flow of
other div elements in the page, and just get a feel for different looks.

> 2-
> <div id="divRandomQuote">
> <p>"Art is making something out of nothing and selling it."<br />
> <strong>Frank Zappa (1940 - 1993)</strong></p>
> </div>
>
> Why not compress this as:
> <p id="divRandomQuote">"Art is making something out of nothing
> and selling it."<br />
> <strong>Frank Zappa (1940 - 1993)</strong></p>
>
> or :
> <blockquote id="divRandomQuote">
> "Art is making something out of nothing and selling it."<br />
> <strong>Frank Zappa (1940 - 1993)</strong>
> </blockquote>
>
> I'm convinced you can make your html markup much more compact here.


The divRandomQuote container has moved around the page a lot. That's the
reason it's a div. It seems to me to make more logical sense to style a div
for position/size/clip and so on. It will almost certainly move again, so I
think I'm likely to keep it as it is.

> Your scripts are not the most efficient either. Your entire writedate
> function could be optimized to render the same content but with much
> more efficient code. It could be reduced from 60 lines to 10 lines or so.


I'll take a look at that.

> If you drop the span in this instruction
> document.write("<span class='date'>"+dateText+"</span>");
> (and you really do not need to create a span here since there is a
> wrapping <p> in the code), then you could gain up to 300% of parsing and
> rendering execution with other code.


Good point. The <span> is there from old renderings of the script in other
pages. In this page it's clearly unnecessary (you might have noticed that
there's no "date" class at all in the style sheet) so I'll drop it.

> Your code has already superfluous containers and your scripts create
> others. Also, it is widely known that innerHTML and document.write are
> the most overused and misused non-W3C-web-standards methods of
> dynamically writing into an HTML document. I do not recommend innerHTML
> and document.write for many reasons: there is always a much better
> alternative.


Um, I've seen a page somewhere that used pure CSS (CSS1 I think) with no
javascript at all to change the text on pages, but I can't remember where.
I'll certainly look into the alternatives, but I had no idea that innerHTML
and document.write were not acceptable methods. Where can I find out more?

Thanks again. You've certainly provided me with food for thought.

Best regards
Neil


 
Reply With Quote
 
Neil White
Guest
Posts: n/a
 
      08-06-2003
Hi Chris,

>
> Over-complicated. Just use one of the many CSS-hiding tricks that
> work on IE.
>
> /* everyone sees this */
> p { font-weight: bold; }
>
> /* IE/Windows doesn't see this */
> html>body p { font-weight: normal; font-style: italic; }
>
> /* or alternatively you could use this one if Mac IE is also a problem */
>
> /* IE/Windows and IE/Mac don't see this */
> p, [hideme] { font-weight: normal; font-style: 200%; }
>
> > I can give more info on how to do this if you feel this might be a good
> > option?

>
> Using CSS selector parsing bugs to hide CSS property parsing bugs is
> usually much simpler and more effective. And doesn't require any
> server-side browser detection (which can be unreliable, especially
> given the number of browsers that fake their UA as Internet Explorer,
> but have different [1] CSS support).
>
> http://www.w3development.de/css/hide_css_from_browsers/ has a whole
> range of CSS-hiding methods for various browsers.
>
> [1] Sometimes better, sometime worse. For that matter, Mac IE and
> Windows IE have incredibly different CSS support, and Win IE5 and Win
> IE6 are different in places too - the CSS hiding tricks let you be a
> bit more flexible.
>
> --
> Chris


Sheesh. Using _this_ bug to hide _that_ bug? My head hurts.

Thanks.
Neil


 
Reply With Quote
 
Chris Morris
Guest
Posts: n/a
 
      08-07-2003
Toby A Inkster <(E-Mail Removed)> writes:
> DU wrote:
> > <blockquote id="divRandomQuote">
> > "Art is making something out of nothing and selling it."<br />
> > <strong>Frank Zappa (1940 - 1993)</strong>
> > </blockquote>

>
> Better:
>
> <p id="divRandomQuote">
> <quote>"Art is making something out of nothing and selling it."</quote>
> <br />
> <cite>Frank Zappa (1940 - 1993)</cite>
> </p>


There's no such thing as a <quote> element, though.

<div id="RandomQuote">
<blockquote>"Art is making something out of nothing and selling
it."</blockquote>
<cite>Frank Zappa (1940 - 1993)</cite>
</div>

--
Chris
 
Reply With Quote
 
DU
Guest
Posts: n/a
 
      08-07-2003
Chris Morris wrote:
> Toby A Inkster <(E-Mail Removed)> writes:
>
>>DU wrote:
>>
>>><blockquote id="divRandomQuote">
>>>"Art is making something out of nothing and selling it."<br />
>>> <strong>Frank Zappa (1940 - 1993)</strong>
>>></blockquote>

>>
>>Better:
>>
>><p id="divRandomQuote">
>> <quote>"Art is making something out of nothing and selling it."</quote>
>> <br />
>> <cite>Frank Zappa (1940 - 1993)</cite>
>></p>

>
>
> There's no such thing as a <quote> element, though.
>
> <div id="RandomQuote">
> <blockquote>"Art is making something out of nothing and selling
> it."</blockquote>
> <cite>Frank Zappa (1940 - 1993)</cite>
> </div>
>


Why do you use a div for that? What is the purpose pursued with wrapping
divs almost everywhere? Why you need to give a wrapping div to the
blockquote. Then why not

<div id="ThenWhyNot">
<div id="RandomQuote">
<blockquote>"Art is making something out of nothing and selling
it."</blockquote>
<cite>Frank Zappa (1940 - 1993)</cite>
</div>
</div>


Why can't you just use <q cite="..." ...> or just <blockquote>... here
in an already well defined block-level element?

DU
--
Javascript and Browser bugs:
http://www10.brinkster.com/doctorunclear/
- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
http://www10.brinkster.com/doctorunc...e7Section.html

 
Reply With Quote
 
Chris Morris
Guest
Posts: n/a
 
      08-07-2003
DU <(E-Mail Removed)> writes:
> Chris Morris wrote:
> > <div id="RandomQuote">
> > <blockquote>"Art is making something out of nothing and selling
> > it."</blockquote>
> > <cite>Frank Zappa (1940 - 1993)</cite>
> > </div>
> >

>
> Why do you use a div for that? What is the purpose pursued with
> wrapping divs almost everywhere? Why you need to give a wrapping div
> to the blockquote. Then why not


It groups the blockquote and the cite and makes styling them easier.
It's not essential all the time.

> <div id="ThenWhyNot">
> <div id="RandomQuote">
> <blockquote>"Art is making something out of nothing and selling
> it."</blockquote>
> <cite>Frank Zappa (1940 - 1993)</cite>
> </div>
> </div>


That <div> is unnecessary, though, yes

> Why can't you just use <q cite="..." ...> or just
> <blockquote>... here in an already well defined block-level element?


<p><q>quote</q> - <cite>author</cite></p> would be equally good for
short quotes, yes.

However, that is the same number of elements as
<div><blockquote>quote</blockquote> <cite>author</cite></div>

The <div> (or the <p> in the inline example) is basically just to
group the quote element with the <cite>, as I don't feel the <cite>
belongs as part of the quotation itself.

--
Chris
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
OT: how to beat death and taxes [short form] /* Microcephalic \Simpson\ Bob */ MCSE 1 09-28-2005 01:07 PM
Has me beat Taranis NZ Computing 14 09-05-2004 10:09 AM
I beat the 70-216 Exam & picked up my MCSA! Paul MCSE 3 11-29-2003 11:12 AM
Re: IE6 has beat me up Headless HTML 2 08-06-2003 06:34 AM
Re: IE6 has beat me up Headless HTML 0 08-06-2003 06:19 AM



Advertisments