VideoBox has gap on bottom. Reason: Inline element. Fix: CSS “display: block”.
-
Greenshift has the same bug as the native video block:
The video block has a gap on bottom (e.g. 8px) which makes it impossible to align it with other block elements or place it flush to the bottom of its container group.
Reason: By default img, video, etc are inline elements:
Graphic from article Removing White Space Below Image Elements
by Morten Rand-Hendriksen.Therefore on their bottom they have a padding. So that the baseline of text before/after is flush with the image / video bottom, and the descender of the text is beyond that (that’s the gap beyond the image / video).
Fix: Just set the
<video>explicitly as a block element withdisplay: blockor similar. You may also watch the ongoing discussion in the corresponding native video block bug what’s the proper “WordPress recommended” solution.Video demo (with audio commentary) of the Greenshift VideoBox:
?? WordPress GreenShift VideoBox block is inline element and therefore on bottom has gap of ca 8px for text descenders
- The topic ‘VideoBox has gap on bottom. Reason: Inline element. Fix: CSS “display: block”.’ is closed to new replies.
