WordPress.org

Make WordPress Core

Opened 21 months ago

Closed 20 months ago

Last modified 20 months ago

#21536 closed enhancement (wontfix)

Better editor background

Reported by: azaozz Owned by:
Milestone: Priority: normal
Severity: normal Version:
Component: TinyMCE Keywords:
Focuses: Cc:

Description

When the editor body has max-width (most newer themes set that) the body in the TinyMCE iframe is aligned left or right (RTL), and the content suddenly stops in the middle (if the browser window is wide). This doesn't look good and is a bit weird and unexpected.

Attachments (2)

editor-bg.png (29.1 KB) - added by azaozz 21 months ago.
21536.patch (1.7 KB) - added by azaozz 21 months ago.

Download all attachments as: .zip

Change History (9)

azaozz21 months ago

comment:1 azaozz21 months ago

Centering the body and adding a light background color to the html element looks a lot better (and resembles desktop editors most users are familiar with).


azaozz21 months ago

comment:2 azaozz21 months ago

21536.patch adds a centered white background on the html element and centers the body. The same effect can be achieved with CSS 3 (without an actual image) but wouldn't work in IE.

comment:3 azaozz21 months ago

In [21495]:

Better editor background, take one, see #21536

comment:4 follow-up: toscho21 months ago

  • Cc info@… added

What I do in my editor stylesheets to stretch the body:

html
{
	background:         #bbb;
	height:             100%;
}
body
{
	max-width:          620px;
	background:         #eee;
	margin:             0 auto;
	padding:            20px;
	min-height:         100%;
	box-sizing:         border-box;
}

Note the box-sizing – it prevents unnecessary scroll bars.

comment:5 in reply to: ↑ 4 azaozz21 months ago

Replying to toscho:

What I do in my editor stylesheets to stretch the body...

Yeah, tried several similar styles. One problem with them is that when inserting a floated image the body doesn't stretch and looks "broken". Another problem is browser differences: without using background-image the css needs 4 variations to cover all supported browsers (yeah, IE7 too).

A nice way of doing this is to create the background image with css3 instead of using a real one. Not working in IE < 10 though.

Version 0, edited 21 months ago by azaozz (next)

comment:6 azaozz20 months ago

  • Resolution set to wontfix
  • Status changed from new to closed

Wontfix, see [21532].

Last edited 20 months ago by azaozz (previous) (diff)

comment:7 SergeyBiryukov20 months ago

  • Milestone 3.5 deleted
Note: See TracTickets for help on using tickets.