html, 
body {
    height: 100%;
}

html {
  height: 100%;
}
body {
  min-height: 100%;
}

Answer:

• ▲ - U+25B2 BLACK UP-POINTING TRIANGLE
• ▼ - U+25BC BLACK DOWN-POINTING TRIANGLE
• ▴ - U+25B4 SMALL BLACK UP-POINTING TRIANGLE
• ▾ - U+25BE SMALL BLACK DOWN-POINTING TRIANGLE

• http://en.wikipedia.org/wiki/Arrow_%28symbol%29#Arrows_in_Unicode
• http://en.wikipedia.org/wiki/Geometric_Shapes

<script src="foobar.js" /> <!-- self-closing script tag -->

<script src="foobar.js"></script>

Solution:

       Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph) do not use the minimized form (e.g. use <p> </p> and not <p />).

<!-- script statements, which may include CDATA sections -->
<!ELEMENT script (#PCDATA)>

2015 update: the flexbox approach

        Note: Though CSS Flexible Boxes Layout specification is at the Candidate Recommendation stage, not all browsers have implemented it. WebKit implementation must be prefixed with -webkit-; Internet Explorer implements an old version of the spec, prefixed with -ms-; Opera 12.10 implements the latest version of the spec, unprefixed. See the compatibility table on each property for an up-to-date compatibility status.

(taken from https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes)

Working example

html,
body {
  height: 100%;
  margin: 0
}

.box {
  display: flex;
  flex-flow: column;
  height: 100%;
}

.box .row {
  border: 1px dotted grey;
}

.box .row.header {
  flex: 0 1 auto;
  /* The above is shorthand for:
  flex-grow: 0,
  flex-shrink: 1,
  flex-basis: auto
  */
}

.box .row.content {
  flex: 1 1 auto;
}

.box .row.footer {
  flex: 0 1 40px;
}

<!-- Obviously, you could use HTML5 tags like `header`, `footer` and `section` -->

<div class="box">
  <div class="row header">
    <p><b>header</b>
      <br />
      <br />(sized to content)</p>
  </div>
  <div class="row content">
    <p>
      <b>content</b>
      (fills remaining space)
    </p>
  </div>
  <div class="row footer">
    <p><b>footer</b> (fixed height)</p>
  </div>
</div>

var d = document;
var odv = d.createElement("div");
odv.style.display = "none";
this.OuterDiv = odv;

var t = d.createElement("table");
t.cellSpacing = 0;
t.className = "text";
odv.appendChild(t);

var odv = $.create("div");
$.append(odv);
// And many more

this.$OuterDiv = $('<div></div>')
    .hide()
    .append($('<table></table>')
        .attr({ cellSpacing : 0 })
        .addClass("text")
    )
;

               Chrome 11  Firefox 4   IE9
<div>            440ms      640ms    460ms
<div></div>      420ms      650ms    480ms
createElement    100ms      180ms    300ms

                Chrome 11
<div>             770ms
<div></div>      3800ms
createElement     100ms

                Chrome 11
<div>            3500ms
<div></div>      3500ms
createElement     100ms

{ "keys": ["ctrl+shift+r"], "command": "reindent" , "args": { "single_line": false } }