ipython/ipython — pull request #4786 by ellisonbg (2014-01-11 21:15:20+00:00)
Title: Reduce spacing of heading cells

The spacing above and below of heading cells has been off for a long time - since the very early days of the notebook. This is an attempt to improve the design of those elements. Here is a rough sketch of what I have done:

* Rendered TextCells now have a 0.5em padding at the top and bottom. This provides a nice 2*0.5em = 1.0em spacing between all rendered text cells. The goal is is to make the spacing between TextCells identical as the spacings within TextCells.
* The `line-height` of headings have been set to 1.0. The reason for this is that line-height add of its space above and below the text. Thus it cannot be used to add asymetric spacing to headings. The sense from everyone is that we want more space above than below.
* For the larger headings (1-4) I use a `margin-top` of 1em (measured wrt to the base font size of 14px). 5 and 6 get slightly smaller.
* The old heading sizes were (28,22,18,14,12,11)px. New ones are (26,22,18,14,12,12). Only minor changes here.
* Heading 6 is now italic bold rather than super small bold.
* Added a 1em padding at the top of the notebook div to provide a bit more space above the first cell.

If you want to try these changes out in your `custom.js` (please do) add the following:

```css
.rendered_html h1{font-size:185.7%;margin:1.08em 0 0 0;font-weight:bold;line-height:1.0;}
.rendered_html h2{font-size:157.1%;margin:1.27em 0 0 0;font-weight:bold;line-height:1.0;}
.rendered_html h3{font-size:128.6%;margin:1.55em 0 0 0;font-weight:bold;line-height:1.0;}
.rendered_html h4{font-size:100%;margin:2em 0 0 0;font-weight:bold;line-height:1.0;}
.rendered_html h5{font-size:85.7%;margin:1.83em 0 0 0;font-weight:bold;line-height:1.0;}
.rendered_html h6{font-size:85.7%;margin:1.83em 0 0 0;font-weight:bold;line-height:1.0;font-style:italic;}
.rendered_html h1:first-child{margin-top:0.538em;}
.rendered_html h2:first-child{margin-top:0.636em;}
.rendered_html h3:first-child{margin-top:0.777em;}
.rendered_html h4:first-child{margin-top:1em;}
.rendered_html h5:first-child{margin-top:1.16em;}
.rendered_html h6:first-child{margin-top:1.16em;}
.rendered_html ul{list-style:disc;margin:0em 2em;}
.rendered_html ol{list-style:decimal;margin:0em 2em;}
.rendered_html *+ul{margin-top:1em;}
.rendered_html *+ol{margin-top:1em;}
.rendered_html *+table{margin-top:1em;}
.rendered_html img{display:block;margin-left:auto;margin-right:auto;}
div.text_cell_render{outline:none;resize:none;width:inherit;border-style:none;padding:0.5em 0.5em 0.5em 0.4em;color:#000000;}
div.cell.text_cell.rendered{padding:0px;}
div#notebook{overflow-y:scroll;overflow-x:auto;width:100%;padding:1em 0 1em 0;margin:0px;border-top:1px solid #ababab;outline:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
```

Here is what this looks like:

![screen shot 2014-01-11 at 1 13 22 pm](https://f.cloud.github.com/assets/27600/1894896/5d238c1a-7b05-11e3-98bf-53ea1a8d176f.png)

![screen shot 2014-01-11 at 1 13 47 pm](https://f.cloud.github.com/assets/27600/1894897/6098d044-7b05-11e3-9eae-21948740bc25.png)

![screen shot 2014-01-11 at 1 14 05 pm](https://f.cloud.github.com/assets/27600/1894898/63c4a018-7b05-11e3-8e05-877696a068d7.png)