图像从容器中脱落，CSS问题？_Css_Wordpress

图像从容器中脱落，CSS问题？

css wordpress

图像从容器中脱落，CSS问题？,css,wordpress,Css,Wordpress,我被困在这个相当简单的问题上，我知道一定有一个简单的解决方案，但我不知道该怎么办。我确信这是一个CSS问题，因为其他一切都运行良好。这是有问题的那一页- 以及用于页面的代码 CSS: HTML/JS： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:

我被困在这个相当简单的问题上，我知道一定有一个简单的解决方案，但我不知道该怎么办。我确信这是一个CSS问题，因为其他一切都运行良好。这是有问题的那一页-

以及用于页面的代码

CSS:

HTML/JS：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>
            jQuery Hover Effect
        </title>
        <script type='text/javascript' src='jquery.js'>
        </script>
        <script type='text/javascript'>
            jQuery(document).ready(function() {
                jQuery("img.a").hover(

                function() {
                    jQuery(this).stop().animate({
                        "opacity": "0"
                    }, "slow");
                }, function() {
                    jQuery(this).stop().animate({
                        "opacity": "1"
                    }, "slow");
                });
            });
        </script>
        <link rel="stylesheet" type="text/css" href="/js/mouseover.css" />
    </head>

    <body>
        <div class="fadehover">
            <img src="pre.jpg" alt="" class="a" />
            <img src="post.jpg" alt="" class="b" />
        </div>
    </body>

</html>


jQuery悬停效果
jQuery（文档）.ready（函数（）{
jQuery（“img.a”）.悬停(
函数（）{
jQuery（this）.stop（）.animate({
“不透明度”：“0”
}“慢”）；
}，函数（）{
jQuery（this）.stop（）.animate({
“不透明度”：“1”
}“慢”）；
});
});

我认为，由于这两幅图像具有绝对位置，div.fadehover无法获得高度。所以加上

高度：700px似乎可以解决这个问题。（从我的角度来看：）
引用另一条评论：你的tab键坏了吗？
有什么问题？页面正常运行……绝对定位的元素不包括在容器大小计算中。@JamWaffles-相反，这些是选项卡。如果您需要帮助并想要演示（这是一个好主意），请不要使用URL缩写，而是设置一个<代码>：）

@Jared您指的是哪些选项卡？我在上面的问题中没有看到任何问题。这就解决了它！！我真不敢相信我在和这个做斗争。谢谢

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>
            jQuery Hover Effect
        </title>
        <script type='text/javascript' src='jquery.js'>
        </script>
        <script type='text/javascript'>
            jQuery(document).ready(function() {
                jQuery("img.a").hover(

                function() {
                    jQuery(this).stop().animate({
                        "opacity": "0"
                    }, "slow");
                }, function() {
                    jQuery(this).stop().animate({
                        "opacity": "1"
                    }, "slow");
                });
            });
        </script>
        <link rel="stylesheet" type="text/css" href="/js/mouseover.css" />
    </head>

    <body>
        <div class="fadehover">
            <img src="pre.jpg" alt="" class="a" />
            <img src="post.jpg" alt="" class="b" />
        </div>
    </body>

</html>