782842 - Editor style should match rendered article style

Status: RESOLVED FIXED

(developer.mozilla.org Graveyard :: Editing, defect, P2)

Description

[Dan Callahan [:callahad]]

The stylesheet used when editing an MDN article does not match the actual display on MDN once the article is saved. I've noticed a few particularly large discrepancies:

1. TH elements in the editor have their contents centered and in bold. When saved, the contents are normal weight and left-aligned.

2. TH elements inside THEAD elements have a grey background when saved, yet in the editor, their background is transparent.

3. Headings are sans-serif in the editor, but serif when saved.

4. Headings have a border-bottom when saved, but no border-bottom in the editor.

Comment 1

[Eric Shepherd [:sheppy]]

More:

Headings are totally different sizes in editor vs. viewing.

Line spacing is very low in editor.

The note box style still has the extra space at the bottom between the last line of text and the bottom edge of the box that we removed in viewing mode.

The text in edit mode is significantly smaller than in viewing mode.

Comment 2

[Eric Shepherd [:sheppy]]

Also:

Layout of <dl> blocks doesn't match. The <dd> part is way farther to the right than in the reading view.

Comment 3

[ethan zheng]

"z-index" style is lost too.

"z-index example" of article at:
https://developer.mozilla.org/en-US/docs/CSS/z-index, 

the "z-index" style of "example section" is lost.

Comment 4

[John Karahalis [:openjck]]

Feature page if you want to capture some design decisions some place permanent:
https://wiki.mozilla.org/MDN/Development/Features/Editor_style_should_match_rendered_article_style

Comment 5

[David Walsh :davidwalsh]

This was merged earlier today.

Comment 6

[John Karahalis [:openjck]]

David: Do those changes close bug 779634 also?