Coffeehouse Thread

35 posts

IE White-space rendering sucks...

Back to Forum: Coffeehouse
  • User profile image
    jsampsonPC

    Very true; am I able to change the thread title? If so, I will. Is it safe for a microsoft employee to be discussing this on a microsoft site? Pertaining to a microsoft application?

  • User profile image
    W3bbo

    AdamKinney wrote:
    You should change the name to "whitespace rendering sucks" because it does.  Just last night I ran into the issue this:

    <img src="a.gif" alt="" />
    <img src="b.gif" alt="" />

    caused the images to have a space between them and in order to make them flush I had to change it to this:

    <img src="a.gif" alt="" /><img src="b.gif" alt="" />

    There's no seperation of layout/style and content there.


    That's because, at heart, Trident is still a HTML renderer rather than an XML renderer, so it treats whitespace differently (as if it were SGML)

    ...have you tried editing the whitespace:; property for the parent element?

  • User profile image
    jsampsonPC

    Hmm, I'll checkout the white-space property when I get home...but to be honest, I have never used it before - could it be the answer to all of my problems? Smiley bah-da-da-dum! We'll see after I return from lunch.

    *clocks out*

  • User profile image
    MasterPi

    jsampsonPC wrote:
    Very true; am I able to change the thread title?


    Did you edit the subject field of the original post?

  • User profile image
    jamie

    jsampsonPC wrote:
    Very true; am I able to change the thread title? If so, I will. Is it safe for a microsoft employee to be discussing this on a microsoft site? Pertaining to a microsoft application?


    just click edit on the first post and change the title

    edit: mvpstar beat me too it.  but its changed from here now

  • User profile image
    BruceMorgan

    Are you using quirks mode or strict mode?

  • User profile image
    jsampsonPC

    BruceMorgan wrote:
    Are you using quirks mode or strict mode?


    Are you refering to CSS? This isn't a CSS issue from what I understand - but I could be wrong.

  • User profile image
    Sven Groot

    jsampsonPC wrote:
    
    BruceMorgan wrote: Are you using quirks mode or strict mode?


    Are you refering to CSS? This isn't a CSS issue from what I understand - but I could be wrong.

    Quirks mode vs. strict mode mainly affects CSS but also a few other things so it's definitely important to know. In case you didn't know, which mode is used depends on the DOCTYPE present in the HTML file. A HTML4.01 DOCTYPE (with both the public and system identifiers present) or higher (or an unknown DOCTYPE) will cause it to use strict mode. No DOCTYPE or an older one will cause it to use quirks mode.

    An easy way to find out is to put the following script in your page:
    <script type="text/javascript">
       alert(document.compatMode);
    </script>

    This'll prompt either "BackCompat" (quirks mode) or "CSS1Compat" (strict mode).

  • User profile image
    jsampsonPC

    The page is in strict mode according to the Doctype.

  • User profile image
    ScottWFB

    jsampsonPC said:
    Hmm, I'll checkout the white-space property when I get home...but to be honest, I have never used it before - could it be the answer to all of my problems? Smiley bah-da-da-dum! We'll see after I return from lunch.

    *clocks out*
    Hi, I have been searching all over for a discussion/resolution on this.  I realize this is an older post, but have you found a way to solve this rendering without having to put all of your images on the same line of code in the editor?  Thanks

  • User profile image
    stevo_

    ScottWFB said:
    jsampsonPC said:
    *snip*
    Hi, I have been searching all over for a discussion/resolution on this.  I realize this is an older post, but have you found a way to solve this rendering without having to put all of your images on the same line of code in the editor?  Thanks

    display: block usually works.. but if not, use floating.. its not just an IE thing either..

  • User profile image
    jsampsonPC

    stevo_ said:
    ScottWFB said:
    *snip*

    display: block usually works.. but if not, use floating.. its not just an IE thing either..

    I don't recall ever experiencing this issue with anything but IE.

    @ ScottWFB, no, I've found no solution. I haven't really noticed it lately though in IE7 - but that doesn't mean it won't creep up on me sometime in the future.

  • User profile image
    stevo_

    jsampsonPC said:
    stevo_ said:
    *snip*
    I don't recall ever experiencing this issue with anything but IE.

    @ ScottWFB, no, I've found no solution. I haven't really noticed it lately though in IE7 - but that doesn't mean it won't creep up on me sometime in the future.

    Firefox and IE do this with lists.. ie puts spaces in everything.. but firefox tends to put spaces above the list items.. you tend to only notice it when using lists to do horizontal menus.. floating always fixes the problem anyway.

  • User profile image
    turrican

    Yepp..

    But hm... unless you need to use IE6, perhaps it is time to ditch the TABLE. The road was very hard for me, but I am very happy that I did ditch the TABLE now, no more mess! =)

  • User profile image
    jsampsonPC

    turrican said:

    Yepp..

    But hm... unless you need to use IE6, perhaps it is time to ditch the TABLE. The road was very hard for me, but I am very happy that I did ditch the TABLE now, no more mess! =)

    Turrican,

    I don't do table-based layouts if that is what you're suggesting. I'm strictly div-based with a strict doctype exclusive. The table in this thread (now 2 years ago) was for representing tabular data.

    Jonathan

  • User profile image
    wisemx

    Flashback: 9 years ago when the battle was between IE and Netscape 4 we, Classic ASP developers using early stages of XML, had to make sure all closing "td" tags where at the end of each line or there would be carriage returns in Netscape.
    This caused table layouts, like rounded corners, to fail in Netscape.

  • User profile image
    Rowan

    stevo_ said:
    ScottWFB said:
    *snip*

    display: block usually works.. but if not, use floating.. its not just an IE thing either..

    There's another method that works well for images - img { vertical-align: top; }

Comments closed

Comments have been closed since this content was published more than 30 days ago, but if you'd like to continue the conversation, please create a new thread in our Forums, or Contact Us and let us know.