Just a few notes on the above.
Best description I have read about these three technologies is:
- HTML5 – Defines the content
- CCS3 – Defines the appearance
DIV & Positioning
I did have a problem positioning and sizing <div> elements. When I was last into HTML tables and tables within tables were used to get the layout you needed. Today, quite rightly, tables are used for what they where intended, and layout is all about <div>. So what are the positioning and sizing problems?
- <div> is a block element. The width of a block level element, unless set explicitly, is 100% of its containing element. Its height, again unless defined explicitly, is defined by its content. No content -> no height -> not visible. So if you are wondering why you have set the background of your <div> element (to say an <img>) and cannot see it, it is possibly because the <div> has no content and hence no height. Judging by the Web, this seems to be a common mistake.
- Second is the position attribute, or rather the relative value of position. With position:relative the <div> element (indeed any element) is still participating in the document flow. So regardless of where it is moved to (i.e. displayed), it still leaves the space where it was in flow. With position:absolute that is not the case. The element is removed from the document flow. That change in behaviour between position:relative and position:absolute does make a huge difference as to when you use one over the other. The choice of which to use is not just about the reason you want an element located where you do, but also how you want it to behave.
Loading HTML snippets
I remember when I was developing web pages back in the late 1990’s one issue was that standard Headers and Footers had to be either manually copied to every page (and updated on every page!), or else loaded dynamically using server-side programming. Guess what? We are still in that situation today. I notice that an RFC for this functionality has been submitted to the W3C. I haven’t read the RFC, so cannot comment on its suitability, but I do hope that, if not this proposal, then something that supplies this functionality is approved soon – and then implemented in the Browsers in short order.