• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.2 How to float right youtube video on XF page

Andy.N

Well-known member
#1
I'm trying to float the video right on a XF page and it works somewhat but I'm curious to see if there is a better way so that the video appears below the text when in responsive mode. Right now, it's on the top of the text when you resize the window.

Code:
<div class="messageText ugc baseHtml">
<div style="float: right; margin-left: 10px;"><iframe width="380" height="214" src="https://www.youtube.com/embed/qqfeUUjAIyQ" frameborder="0" allowfullscreen></iframe></div>
<p>This is some text. I'm trying to float the video right on a XF page and it works somewhat but I'm curious to see if there is a better way so that the video appears below the text when in responsive mode. Right now, it's on the top of the text when you resize the window.</p>
I tried to put the video code under the text or float the text but it doesn't work.
 

Andy.N

Well-known member
#3
For one, responsive can only be designed when using classes, so that's your first issue to correct.
Not sure I can understand what you tried to say, Jeremy.
My style is responsive and all element scales down correctly. I'm just trying to see if there is another way to use the div and float tag to show the video after the text instead of before it.
 

Jeremy

Well-known member
#4
This code should be defined in a custom class and not inline:
Code:
float: right; margin-left: 10px;
Or else it will be annoyingly difficult to define responsive properties.