diff --git a/examples/embeds/video.js b/examples/embeds/video.js
index c09b86398..3c9feace7 100644
--- a/examples/embeds/video.js
+++ b/examples/embeds/video.js
@@ -59,30 +59,22 @@ class Video extends React.Component {
const wrapperStyle = {
position: 'relative',
- paddingBottom: '66.66%',
- paddingTop: '25px',
- height: '0',
outline: isSelected ? '2px solid blue' : 'none',
}
const maskStyle = {
display: isSelected ? 'none' : 'block',
position: 'absolute',
- top: '0px',
- left: '0px',
- right: '0px',
- bottom: '0px',
+ top: '0',
+ left: '0',
height: '100%',
+ width: '100%',
cursor: 'cell',
zIndex: 1,
}
const iframeStyle = {
- position: 'absolute',
- top: '0px',
- left: '0px',
- width: '100%',
- height: '100%',
+ display: 'block'
}
return (
@@ -92,7 +84,7 @@ class Video extends React.Component {
id="ytplayer"
type="text/html"
width="640"
- height="390"
+ height="476"
src={video}
frameBorder="0"
style={iframeStyle}
@@ -110,12 +102,17 @@ class Video extends React.Component {
renderInput = () => {
const { node } = this.props
const video = node.data.get('video')
+ const style = {
+ marginTop: '5px',
+ boxSizing: 'border-box'
+ }
+
return (
)
}
diff --git a/packages/slate-react/src/components/void.js b/packages/slate-react/src/components/void.js
index 2b795a310..0a1b964c7 100644
--- a/packages/slate-react/src/components/void.js
+++ b/packages/slate-react/src/components/void.js
@@ -7,7 +7,6 @@ import { Mark } from 'slate'
import Leaf from './leaf'
import OffsetKey from '../utils/offset-key'
-import { IS_FIREFOX } from '../constants/environment'
/**
* Debug.
@@ -141,10 +140,12 @@ class Void extends React.Component {
const { children, node } = props
let Tag, style
- // Make the outer wrapper relative, so the spacer can overlay it.
if (node.kind === 'block') {
Tag = 'div'
- style = { position: 'relative' }
+ style = {
+ display: 'inline-block',
+ verticalAlign: 'top'
+ }
} else {
Tag = 'span'
}
@@ -154,14 +155,13 @@ class Void extends React.Component {
return (
{this.renderSpacer()}
-
+
{children}
@@ -182,20 +182,12 @@ class Void extends React.Component {
let style
if (node.kind == 'block') {
- style = IS_FIREFOX
- ? {
- pointerEvents: 'none',
- width: '0px',
- height: '0px',
- lineHeight: '0px',
- visibility: 'hidden'
- }
- : {
- position: 'absolute',
- top: '0px',
- left: '-9999px',
- textIndent: '-9999px'
- }
+ style = {
+ display: 'inline-block',
+ verticalAlign: 'top',
+ width: '0',
+ color: 'transparent'
+ }
} else {
style = {
color: 'transparent'
diff --git a/packages/slate-react/test/rendering/fixtures/custom-block-void.js b/packages/slate-react/test/rendering/fixtures/custom-block-void.js
index e1236bac3..dfd606d30 100644
--- a/packages/slate-react/test/rendering/fixtures/custom-block-void.js
+++ b/packages/slate-react/test/rendering/fixtures/custom-block-void.js
@@ -23,13 +23,13 @@ export const state = (
export const output = `