I’m not quite sure I understand what you mean by “alongside it”.
If you mean creating a caption and a frame, you might use the WordPress shortcode [caption] to make WordPress create the HTML for you:
[caption align="alignright" width="300" caption="YOUR CAPTION TEXT HERE"]
<YOUR EXISTING VIDEO HTML ELEMENTS GO HERE>
[/caption]
Instead of alignright you may use alignleft or aligncenter
Thread Starter
brian
(@brianjobs-top)
Hi
What I meant was I want to write completely seperate text in the space to the right of the video.
Somehow I have to isolate the video with a box or border or something so text can be written alongside it.
Does this make any sense?
And thanks for your help.
Brian.
For the 3D Animator page http://jobs-top.com/how-to-become-a-3-d-animator/ below is the current html. If you could show me where to change it that would be great.
<li>More details about how to become a 3D animator below</li>
<iframe src="http://www.youtube.com/embed/EizwgfkyrEU?rel=0" frameborder="0" width="480" height="360"></iframe>
<p style="text-align: center;"><strong>Have You Worked As A 3D Animator?</strong></p>
It looks like your video is embedded in a ‘p’ tag, and the text you want to the right of it is in a ‘p’ tag, as well.
I suggest putting your video and text in a single div, and then embed two divs inside that, such that:
html:
<div class="vid_and_text>
<div class="vid">
<!--put video here-->
</div>
<div class="text">
<!--put text here-->
</div>
</div>
.css
.vid_and_text{
position:relative;
float:left;
width:900px;/*width of container div*/
}
.vid{
position:relative;
float:left;
width:480px;/*width of video*/
}
.text{
position:relative;
float:left;
width:420;/*remaining width of container*/
}
You’ll likely have to adjust widths of divs to allow for any white space you want around the divs.
1. To have text flow to the right of a box (image/video) you set the CSS property float to left. Plus, you probably want some right margin on the box.
2. To ensure additional text do not flow, but start to the left below the box, you may insert a <br/> element styled to jump down to where the left margin is clear. Like this:
<iframe src="http://www.youtube.com/embed/EizwgfkyrEU?rel=0" frameborder="0" width="480" height="360" style="float: left; margin-right: 1em"></iframe>
Video text here, will appear to the right of video box.
<br style="clear: left"/>
Continue your post text here, will appear below video box.
Please enter all CODE, including HTML in backtics
One of the forum posts above probably violate this, and clutters the layout of this forum thread. Please edit your forum post.
Thread Starter
brian
(@brianjobs-top)
Hi
I’ve tried various combinations of your html advice, but I couldnt get it to work. Perhaps I’m too green.
I can’t understand why I can’t just put a box around a video to allow me to write to the right-hand-side of it as well as above and below.
Your css code is well beyond me.
Thanks anyway
Brian.
I wrote my html suggestion on my blog, in the HTML tab (not the visual editor), and it worked as I expected. You don’t need another box, as the video iframe is a box already. You just have to make sure it’s left aligned. That you can do by adding style="float: left" to your iframe. Quite simple.
Publish the post using my code, and give us the link.
Thread Starter
brian
(@brianjobs-top)
Finally, I got it!!!
Thanks very much for your help, and patience.
Brian.
I am very new and am enjoying working on my new site, but i need to cut my learning curve down if possible.
I found this blog to be close to my problem, I have youtube video that I would like to be sized at 200×200 and placed on the left side of my page along with text that I am able to place on the right side of the video.
<iframe width=”420″ height=”315″ src=”http://www.youtube.com/embed/2Hw_sCV6r8Y” frameborder=”0″ allowfullscreen></iframe>
Thank you in advance!
Mark
http://www.sylviaglobal.com
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Marksgm,
You’re much more likely to receive help if you post your own thread, than on this.
