如何将flash影片与“overflow:hidden”对齐?

时间:2009-10-28 18:34:48

标签: css

我有一部超级电影(适合更多的屏幕分辨率) 我想将它与一个(例如)85%宽的div的中心对齐(溢出的闪光灯仍然隐藏)。
我怎么能这样做?

EDIT2:

我想用css(而不是javascript)这样做:
(我用文字替换了flash,使帖子更短,问题也一样)

<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>

2 个答案:

答案 0 :(得分:2)

你不能使用text-align来对齐div,因为div是块元素。如果为容器div和flash div指定宽度,可以执行的操作是将左右边距设置为auto

#flash {
 width: 50%;
 margin: 0 auto 0 auto;
}

答案 1 :(得分:0)

看起来很简单,也许我错过了什么?

div上的

div {
    width:85%;
    overflow:hidden;
    text-align:center
}

如果不起作用,您可以向我们展示您的代码