Adding CSS to Editable tag messes up the placeholder

[davidsword]

Safari 11, wp 4.9.4, gb 2.1.0

Got an Editable component

<div className="textBox">
    <Editable
        tagname="div"
        multiline="p"
        className="textBoxContent"
        placeholder="...."
        value={ attributes.content }
        onChange={ onChangeContent }
    />
</div>

The Editor .textBoxContent has some CSS to it, within the editor:

div.textBox {
    margin: 20px 0;
    .textBoxContent {
        width: 90%;
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
        border: 1px solid red;
    }
}

The CSS messes changes mess with .blocks-editable__tinymce[data-is-placeholder-visible=true] element (the one that only shows when there's no content in Editor). Perhaps the placeholder needs some better CSS mirroring to factor in developers doing weird css things like I've done?

Don't know if it's as simple as "don't change the size/position of your Editable tag then" or if ya'll at a point of factoring in developer plugins - but thought I'd bring it up.

[aduth]

Possibly related: #5035

[youknowriad]

A lot of changes happened since this (including the component being rename RichText now). Is this still an issue?