Rich text: remove inline display warning #32013
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ellatrix
added
[Feature] Rich Text
ellatrix
requested review from
ajitbohra,
cameronvoell and
guarani
as code owners
|
Size Change: -68 B (0%) Total Size: 1.62 MB
ℹ️ View Unchanged
|
ellatrix
force-pushed
the
remove/rich-text-inline-warning
branch
from
469d8dd to
c42e4d1
Compare
ellatrix
commented
May 20, 2021
| In some cases the placeholder content on RichText can appear separate from the input where you would write your content. This is likely due to one of two reasons: | ||
|
|
||
| 1. You can't have an element with the CSS `display` property set to `inline`. You will need to set it to `inline-block` or any other value. | ||
| 2. The `position` CSS property value for the element must be set to `relative` or `absolute` within the admin. If the styles within style.css or editor.css modify the `position` property value for this element, you may see issues with how it displays. |
There was a problem hiding this comment.
This is no longer relevant either. The placeholder is purely text and no longer positioned over the rich text field.
|
Cool |
fullofcaffeine
added a commit
that referenced
this pull request
May 22, 2021
…-take-2 * trunk: (57 commits) Image block: fix cover transform and excessive re-rendering (#32102) compose: Add types to useMergeRefs (#31939) Navigation: Fix collapsing regression. (#32081) components: Promote Elevation (#31614) compose: Add types to useReducedMotion and useMediaQuery (#31941) Update the graphic that appears in the Template Editor welcome guide (#32055) Block Navigation: use CSS for indentation with known max indent instead of spacer divs (#32063) Fix broken template part converter modal styles. (#32097) compose: Add types to `usePrevious` (#31944) components: Add ZStack (#31613) components: Fix Shortcut polymorphism (#31555) compose: Add types to `useFocusReturn` (#31949) compose: Add types to `useDebounce` (#32015) List View: Simplify the BlockNavigation component (#31290) Remove query context leftovers (#32093) Remove filter_var from blocks (#32046) Templates: Remove now-obsolete gutenberg_get_template_paths() (#32066) [RNMobile] Enable reusable block only in WP.com sites (#31744) Rename ViewOwnProps to PolymorphicComponentProps (#32053) Rich text: remove inline display warning (#32013) ...
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
It's been a while since we added the warning (#13921) and I can no longer reproduce the original issues with having an inline container as an editable host. I tested this in Chrome, Firefox and Safari and it works great. Maybe it's because we keep the container always padded (with a zero width character), or because we maintain selection well, or maybe the browsers have fixed this, I'm not sure.
I'm confident that if any issues do pop up, we can fix then in rich text itself by preventing default browser behaviour.
How has this been tested?
Test the site title, for example, in all browsers. Especially test the Backspace key.
Screenshots
Types of changes
Checklist:
*.native.jsfiles for terms that need renaming or removal).