Loading a div only after parent div loaded correctly

I am developing for a pre existing PHP based system.

I am trying to load this bit of code

<div style="border:1px solid #000000;height:20px;">
    <marquee>This is some scrolling text<br>more text<br>more text</marquee>
</div>

Problem is, for a split second, when a visitor loads the page he sees the entire <marquee> content, and only after a secon开发者_JS百科d the parent div loads and fits the <marquee> into the bordered div.

How can I avoid this?

Note: I cannot use jQuery as it conflicts with many other loaded js files that are loaded to that page (even when using jQuery.noconflict()).

---

A q&d solution for these kinds of cases - I'm not saying it's the best for yours, or especially elegant - is to declare the marquee with visibility:hidden and unhide it by script at the end of the page, or at the end of whatever onload codd you have. And if it still unhides too soon, envelop the unhiding code in a setTimeout(function(){ ... }). That will usually force the browser to do a layout before running the code.

---

Note: I cannot leave comments yet...

Can you try putting the style directly in the marquee?

<marquee style="border:1px solid;height:20px;">text</marquee>

and like the previous commenter said, marquee is not recommended to use (and it's really annoying most of the time)