HTML Contents are not displaying in correct place.

  • 1
  • Problem
  • Updated 9 years ago
Just started out on yola. Found it amazing. Awesome.
But, I have been having a bug of some HTML contents displaying incorectly. Maybe it's not my coding, not yola, but still I need an answer. Here is my problem:
(Please take a minute or two of your time to answer)

First of, look at
theminecrafter.yolasite.com/home-page-real.php
Scroll down until you reach the location of the youtube video.
Now tell me this: Is it inside the column of the block brick? On my computer, it is. On others I've checked, it isn't. This is probably because of different comptuer sizes, if you know what I mean. It (The youtube video) is probably out of place on your computer-it should fit in the left, thinner column. Please tell me how to fix this. If you need more information to help, ask me.
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
  • Condifent...

Posted 9 years ago

  • 1
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Your coding was wrong and not only breaking the page but causing the misalignment. The fact that the bottom half of your page was missing was a sign that this is the problem.

Delete yours and try this one: I already added your video and set the dimensions...

<!--

<iframe title="YouTube video player" width="335" height="250" src="https://www.youtube.com/v/m_yqOoUMHPg?..." frameborder="0" allowfullscreen></iframe>

-->

Happy site building
Ed

You can find me with my head in the honey pot here...

Honey Bear Playhomes Tips and Favs in one place... A Honey bear Playhomes Tip ;)
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
Thanks for answering, but 1.
The bottom half is not finished, so naturally it is broken of
2.That code will simply put it at the top of the page. I did this code because it positons it close to the column.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Okay well try the code with the dimension setting both the same... There are two places that require the same values or it will throw off the players alignment.

<!--

<object width="335" height="250"><param name="movie" value="https://www.youtube.com/v/m_yqOoUMHPg?... name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="https://www.youtube.com/v/m_yqOoUMHPg?..." type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="335" height="250"></embed></object>

-->
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
Listen the border is actually an image. Its not part of yola. If i palce is as a html widget it will simply go on top on the top of the image.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
I think that you would be better served using a two column widget and and placing the HTML widget with the code above into either side and use the margin setting of the two column widget to lock the video player into a precise location on your page instead of having it float around on screens of varying resolutions.

<!--

<DIV style="position: absolute; top:528px; left:210px; width:200px; height:25px">

-->

That code is great and all if you want to position an element outside the style's border/boundaries but has positioning issues inside the page. I use it extensively and came to the conclusion that I get far better results using the margin settings of a two column widget.
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
Okay, I'll try it out. Thanks. I can't believe I could'nt think of this. Works perfectly. I tested it. I will publish fully later.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Ever try z-index=99999 before? It layers objects quite nicely.

Once I see the word listen I move on...

Good luck...
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Using the two-column widget will ensure that you never see the floating effect of that positioning bit of code.







You can only imagine the nightmares I had to endure to get mine to look okay on most resolutions. The smaller screens still don't like me but I designed it for larger ones anyway...http://www.honeybearplayhomes.com/
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
z-index=99999? No, I dont know how it works
Photo of Minecrafter

Minecrafter

  • 15 Posts
  • 0 Reply Likes
Thanks for answering, but 1.
The bottom half is not finished, so naturally it is broken of
2.That code will simply put it at the top of the page. I did this code because it positons it close to the column.