Product:
Question:
I can’t get my videos standing side by side. Can you please help?
Answer:
This is a general web design positioning issue.
To place two videos side by side, you can place them inside two divs, then use CSS code to position the divs and make them side by side:
In the WordPress post or page editor, switch to Text mode, then add the following code around the WonderPlugin Video Embed shortcode.
<div style="float:left;padding:12px;">
[wonderplugin_video iframe="https://www.youtube.com/watch?v=_mMKNw_Mlxs" lightbox=1 lightboxsize=1 lightboxwidth=960 lightboxheight=480 showimage="https://img.youtube.com/vi/_mMKNw_Mlxs/0.jpg" videowidth=240 videoheight=180 keepaspectratio=1 autoplay=1 videocss="position:relative;display:block;background-color:#000;overflow:hidden;max-width:100%;margin:0 auto;" playbutton="https://www.wonderplugin.com/wp-content/plugins/wonderplugin-videoembed/engine/playvideo-64-64-1.png"]
</div>
<div style="float:left;padding:12px;">
[wonderplugin_video iframe="https://www.youtube.com/watch?v=pChmieCDWpo" lightbox=1 lightboxsize=1 lightboxwidth=960 lightboxheight=480 showimage="https://img.youtube.com/vi/pChmieCDWpo/0.jpg" videowidth=240 videoheight=180 keepaspectratio=1 autoplay=1 videocss="position:relative;display:block;background-color:#000;overflow:hidden;max-width:100%;margin:0 auto;" playbutton="https://www.wonderplugin.com/wp-content/plugins/wonderplugin-videoembed/engine/playvideo-64-64-1.png"]
</div>
<div style="clear:both;"></div>
The CSS float:left will float the div to left and place the two divs side by side. The <div style="clear:both;"></div> will clear the float layout at the end of the two divs.
