How can I maintain webplayer aspect ratio on a web page using CSS

I have browsed the CSS forums but nothing that they suggest for maintaining aspect ratios of images and divs seem to work? I want the player to scale fluidly if the user scales the browser window.

Has anyone ever done this? I find it difficult to believe nobody has ever tried using the webplayer on a fluid webpage layout.

Note: My game GUI code works fine, its the proportions of the overall Unity window that I want to maintain. (ie even if the window contained nothing it should still be 4:3)

In my javascript file I have tried using:

unityObject.embedUnity("unityPlayer", "http://myGame.unity3d", "100%", "100%",params);

but proportions are lost. And if I do a fixed pixel size then obviously the Unity window wont scale to fir the browser window.

Most common flexible layout is the full browser layout and that is easy and there are plenty of examples for that in the web.
In your case you can setup the special javascript functions:

  1. body onload:
  • calculate the browser window size, set the css dimensions, embedUnity with “100%”, “100%” in the containing div tags
  1. window.onresize:
  • recalculate the browser window size, set new css dimensions for the div tags containing the WebPlayer - in case of resize event