molly.com

Friday 30 March 2007

Back to Work: Someone Please Clearly Articulate hasLayout?

At the recent AEA Boston, both Eric Meyer and I were stumped by two questions asking to explain hasLayout. Neither of us could articulate it well.

I’ve studied the documents, talked to some friends who have worked closely with it, and still fail to have a clear understanding of this rather mysterious piece of the way Internet Explorer handles layout.

Anyone who can help out by explaining and articulating, in as simple a description as possible, what hasLayout is and how it works . . . well, I’d be grateful!

Filed under:   professional, software, browsers, microsoft, ie7, aea
Posted by:   Molly | 4:49 am |

63 Responses to “Back to Work: Someone Please Clearly Articulate hasLayout?”

  1. bruce Says:
    March 30th, 2007 at 5:09 am

    The real answer:

    “Layout” is an IE/Win proprietary concept that determines how elements draw and bound their content, interact with and relate to other elements, and react on and transmit application/user events.

    This quality can be irreversibly triggered by some CSS properties. Some HTML elements have “layout” by default

    http://www.satzansatz.de/cssd/onhavinglayout.html

    The real answer is that it’s mysterious voodoo.

    I wonder if they’ll nuke it in IE8.

  2. Dave Sussman Says:
    March 30th, 2007 at 5:11 am

    Oh yeah, we need this. I did a conference talk on IE7 earlier this week and couldn’t explain it either. This is the best description I’ve found: http://www.satzansatz.de/cssd/onhavinglayout.html

  3. pepelsbey Says:
    March 30th, 2007 at 5:28 am

    Don’t think that they’ll nuke it in «IE-N».
    Backward compatibility, you know…

  4. eSearing Says:
    March 30th, 2007 at 5:36 am

    To me, it is like going to grandmas for dinner. Unless you tell your grandma what you wanted her to cook, dinner is a surprise, but limited to her usual tasty recipies. However, once in a while you get Lima bean and brusselsprout casserole.

    Unless you tell the browser what layout you want for each element, it is going to guess, or do what it has been programmed to do.

  5. ritchie Says:
    March 30th, 2007 at 6:03 am

    it’s way over my head but this makes the most sense:

    The object model inside Explorer appears to be a hybrid of a document model and their traditional application model. I mention this as it is important in understanding how Explorer renders pages. The switch for jumping from a document model to an application model is to give an element “layout”. Elements acquire “layout” when they are assigned a numeric width or height.

  6. Chris Casciano Says:
    March 30th, 2007 at 6:09 am

    I don’t think you want me to articulate what I think hasLayout is.. ;)

  7. Ara Pehlivanian Says:
    March 30th, 2007 at 6:37 am

    I think it’s a mistake wrapped in an enigma.

  8. Lionel Fourquaux Says:
    March 30th, 2007 at 6:41 am

    My understanding is that “hasLayout” is an internal implementation detail in IE, that describes whether the element’s (and its children’s) position is calculated by calling a method of the element’s associated object (in which case it has layout) or by calling a method of the parent object.
    Giving an element “layout” works around some bugs because different code paths are involved, but ideally (in a bug-free implementation) it should be completely irrelevant to web developers.

  9. Ingo Chao Says:
    March 30th, 2007 at 6:51 am

    It’s a sort of ‘block formatting context’.

  10. Ian Muir Says:
    March 30th, 2007 at 6:55 am

    The way I understand it is that it’s largely a legacy thing.

    In IE5, especially IE5.2 for Mac, setting hasLayout seemed to force the browser to recognize the CSS positioning. In general, hasLayout = false means that the browser is controlling the layout (positioning, size, etc) hasLayout = true means that CSS is controlling the layout.

    In IE6, it seems that hasLayout is automatically set for most properties that would need it and IE7 just seems to have it on almost all the time by default.

    From a programming standpoint, I’d say that this is something that was put in to get some CSS stuff to work without having to rewrite the rendering engine. I would be surprised if it was taken out unless they build a completely new browser from scratch.

  11. thacker Says:
    March 30th, 2007 at 7:15 am

    Very interesting. Thank you.

    Does the haslayout property within IE7 explain some of the rendering issues of its page zoom function — such as the zoom of left and right margins for centered content?

    It appears that setting this property’s value to none for impacted div tags may resolve that issue?

    Any input would be appreciated.

    Sorry I lack the knowledge to answer the original question that Molly presented.

    Thanks.

  12. ralph Says:
    March 30th, 2007 at 12:34 pm

    Andy Budd’s book CSS Mastery explains it this way, more or less: if an item controls its own size and placement, it has layout. If it doesn’t control its own size and placement, it doesn’t have layout, and its size and placement are controlled by the nearest ancestor element that does have layout.

    It’s a hack to increase performance so that IE doesn’t have to figure out size and placement for every page element.

  13. Tim Connor Says:
    March 30th, 2007 at 2:15 pm

    hasLayout is an alias for !vooDooMode. It means it’s come out of the limbo state of IE thinking “Oh sweet, nothing is strictly defined for this element - I can do whatever is fastest and easiest” into a defined state where it has to obey the laws of CSS physics. hasLayout means opening the box on the Schroedinger’s cat of the IE render model and finding out if it’ll act like a block/inline, relative/absolute, etc/etc, instead of some nebulous undefined state.

    It’s isNotNull for the box-model. Or least, that’s how it’s always seemed to me.

  14. Blog Says:
    March 30th, 2007 at 9:40 pm

    An Event Apart Boston Summary

    So I am finally getting around to writing up a summary of my time at An Event Apart Boston. I can’t even express how much that I learned. It was amazing to see so many respectable names in the web…

  15. Switch-Case / Blog Archive / Links for 3/31/07 [my NetNewsWire tabs] Says:
    March 31st, 2007 at 4:27 pm

    […] molly.com » Back to Work: Someone Please Clearly Articulate hasLayout? &emdash; My arch-nemesis: hasLayout […]

  16. Ingo Chao Says:
    April 1st, 2007 at 2:01 pm

    A search in the MSDN revealed a widely unknown property (erroneously called attribute) and I thought I share some findings.
    The property is similar to the haslayout property and is called hasconcept. hasconcept is set to true when some CSS declarations are made.
    Promising tests showed this solves for many problems in the Trident engine haslayout is not able to cope with; it even provides some more CSS2.1 compliancy. For example, it is known that display:inline plus zoom:1 acts like display:inline-block. But: if hasconcept is set to true in addition, it acts like display:table-cell. And even better, the pseudo-element :first-letter will simulate :after (in quirksmode, that is).
    To make use of it, first of all, authors have to determine the status of hasconcept in their documents: true | false | undefined . Authors simply have to write
    javascript:alert(document.hasconcept)
    in the IE5.5+ address bar.
    If the document in question has this property set to undefined, the rendering is going to get slightly buggy under circumstances that are not entirely clear to me yet (the rendering might appear correct on your display, but on another display, it won’t: check carefully if boxes are positioned a few pixels off on your client’s PC).
    I am preparing an in-depth article to demystify this voodoo property (a long technical read -sorry-, to be published on April 2, 2007). A new magick bullet, that’s for sure.

  17. thacker Says:
    April 2nd, 2007 at 6:49 am

    Ingo Chao–

    Hopefully, you will be back here to post a link to your publication regarding haslayout, hasconcept, et al.

    It would be very much appreciated.

    Thank you very much.

  18. Ingo Chao Says:
    April 2nd, 2007 at 8:16 am

    Hi Thacker, please forgive me, it was April Fool’s Day, and I couldn’t resist to write something self-ironical. The cited article on having layout we wrote is descriptive for the most part. For another article, see the MSDN haslayout overview. Sorry again.

  19. Chris Wilson (MSFT) Says:
    April 2nd, 2007 at 9:41 am

    That was a good one, Ingo. You had me doing an MSDN search (”Huh?!?!? I don’t remember any hasconcept…”), but I did realize what day it was yesterday when it turned up no results. :)

  20. thacker Says:
    April 2nd, 2007 at 12:08 pm

    :::chuckling::: Thanks, Ingo. I am, again, reminded of an applicable Jack Nicholson quote from a “Few Good Men”:

    “Well, don’t I look like the f–king asshole.”

  21. Dr.Lord Says:
    May 2nd, 2007 at 6:49 pm

  22. Marc Says:
    May 29th, 2007 at 10:15 am

    Hello,
    thank you very much!
    This description is perfect for me! I searched just this.

    I make an link on my website to this here.

    bye

  23. çeviri Says:
    July 8th, 2007 at 1:43 pm

    I think it’s a mistake wrapped in an enigma.

  24. Seo Ve Dizin Makaleleri Says:
    August 14th, 2007 at 1:53 pm

    I don’t think you want me to articulate what I think hasLayout is

  25. Kopux.NET Says:
    September 1st, 2007 at 4:54 am

    I think it’s a mistake wrapped in an enigma.

  26. forum Says:
    September 4th, 2007 at 2:32 pm

    Hi
    good nice
    post thanks.

  27. ForumCu Says:
    September 10th, 2007 at 2:28 am

    Hi
    good nice
    post thanks.

  28. Forum Says:
    September 13th, 2007 at 1:04 am

    This article is very interesting and written by some clever guy.:) Thank you!

  29. forum Says:
    September 18th, 2007 at 3:28 am

    thanks you.

  30. forum siteleri Says:
    September 18th, 2007 at 3:29 am

    forum siteleri, forum, paylaşım

  31. vodafone kontör transfer Says:
    September 19th, 2007 at 6:01 am

    thanks…

  32. Dizin Says:
    September 21st, 2007 at 9:51 am

    thank you very much!
    This description is perfect for me

  33. cam balkon Says:
    September 22nd, 2007 at 6:05 pm

    nice

  34. Mike Says:
    September 25th, 2007 at 1:26 pm

    schöne seite, weiter so…

    LG Mike

  35. 电炉 Says:
    October 24th, 2007 at 11:47 am

    Nice Site!

  36. ilahi Says:
    December 4th, 2007 at 1:36 pm

    thanks… :)

  37. Aras-Çanta Says:
    January 15th, 2008 at 10:52 am

    thankss..

  38. irc Says:
    January 29th, 2008 at 12:26 pm

    thanx

  39. Alanya Says:
    January 31st, 2008 at 8:40 pm

    Those who choose to take the “slights and disappointments” path, meanwhile, are very generously compensated for their trouble

  40. forma Says:
    February 13th, 2008 at 12:36 pm

    forma imalat uretici

  41. ilahi Says:
    February 16th, 2008 at 3:12 am

    thankss so much

  42. Forum Says:
    February 16th, 2008 at 5:34 pm

    we’ll post an update here once it’s done

  43. navigation comand Says:
    February 25th, 2008 at 5:46 am

    superr

  44. IE Bug - hasstyle - XHTMLforum Says:
    February 29th, 2008 at 2:52 am

    […] Bei derartigen Bugs hilft, glaube ich, nur noch hasconcept __________________ Ingo Chao […]

  45. AffettimSeni Paylasim Alani Says:
    March 7th, 2008 at 1:07 pm

    thanks for all

  46. Seks hikayeleri Says:
    March 9th, 2008 at 8:35 am

    Thanx molicim

  47. Sex hikayeleri Says:
    March 9th, 2008 at 8:36 am

    eyw. moli

  48. elişi,dantel,örgü modelleri Says:
    March 17th, 2008 at 7:13 am

    nice site

  49. firefox indir Says:
    March 30th, 2008 at 10:58 pm

    thanks

  50. bruce Says:
    April 7th, 2008 at 4:03 am

    it is easy to find it, i think u just search on google or yahoo

  51. evden eve Says:
    April 8th, 2008 at 8:09 am

    but, i think it is another thing which you have

  52. universal trade Says:
    April 8th, 2008 at 6:12 pm

    i like it

  53. trade Says:
    April 8th, 2008 at 11:24 pm

    interesting, thanks

  54. surucu kursu Says:
    April 9th, 2008 at 8:20 am

    do you know everything about css?

  55. belediye Says:
    April 9th, 2008 at 5:10 pm

    how can i find everything about css?

  56. ticaret odasi Says:
    April 10th, 2008 at 7:11 am

    what do you want to learn about css? we can help easily

  57. milliyet Says:
    April 11th, 2008 at 12:21 pm

    i want learn too, i want start at the beginning of css

  58. umit Says:
    April 21st, 2008 at 4:08 pm

    it is good t see u

  59. uygar Says:
    April 21st, 2008 at 8:16 pm

    thats the matter i want to learn

  60. net gazetesi Says:
    April 22nd, 2008 at 7:40 pm

    Nice job.

  61. oyun Says:
    April 22nd, 2008 at 7:40 pm

    Thanks,very nice blog.

  62. sanayi odasi Says:
    April 23rd, 2008 at 5:30 pm

    ok,thanks

  63. fikralar Says:
    April 24th, 2008 at 8:00 am

    hi, umit. how is going on

Leave a Reply

Elsewhere

Roll Roll Roll