I have a wide flash movie (to fit in more screen resolution).
I would like to align it to a center of a (for example) 85%-wide div (and the overflowing flash remains hidden).
How could i do that?
edit2:
I'd like to do this with css (and not with javascript):
(I've replaced the flash with text to make the post shorter, the problem is the same)
<html>
<head>
<style>
#div {
width: 20%;
overflow: hidden;
text-align: center;
background-color: lightblue;
}
#flash {
width: 400px;
background-color: blue;
position: relative;
top: 0px;
margin: 0 auto;
}
</style>
<script src="jquery-1.3.2.min.js"></script>
<script>
function center() {
var flash = parseInt($("#flash").css('width'));
var div = parseInt($("#div").css('width'));
if (flash > div) {
var right = ((flash - div) / 2) + "px";
$("#flash").css("right", right);
}
}
$(window).resize(function(){
center();
});
$(function(){
center();
});
</script>
</head>
<body>
<div id="div">
<div id="flash">texttexttexttexttext-[CENTER]-texttexttexttexttext</div>
</div>
</body>
</html>