Question

嘿，我正在尝试制作这个侧栏。当我在interent explorer中查看它时，它看起来不对。

下载一个链接，在firefox的chrome中查看，然后在IE中查看它，这样你就可以看到我在说什么。 http://sickassvideos.com/player.php?id=1

以下是创建这些侧边栏框的代码：

<div id="social">
                <h3>What we're about... </h3>
                <p>Our mission is to provide you with a continous and reliable stream of sick ass videos.</p>
            </div> <!-- socila -->
            <div id="social">
                <center>
                <table>
                    <tr>
                        <td><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/pages/SickAssVideoscom/123296977742117" width="292" show_faces="false" stream="false" header="true"></fb:like-box></td>
                    </tr>
                </table>
                </center>
            </div> <!-- social -->

            <div id="social">
                <center>
                <table>
                    <tr>
                        <td><img src="/images/logo.jpg" width="60px" height="60px"></td>
                        <td><h2>Coming soon!</h2><p>iPad and iPhone app</p></td>
                    </tr>
                </table>
                </center>
            </div> <!-- social -->
            <div id="social">
                <script type="text/javascript"><!--
                google_ad_client = "ca-pub-1520655484798685";
                /* Small ad */
                google_ad_slot = "2637780657";
                google_ad_width = 200;
                google_ad_height = 200;
                //-->
                </script>
                <script type="text/javascript"
                src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
                </script>
            </div>

这是id =“social”的风格

#content div#sidebar {
float: right;
}
#content div#social {
    float: right;
    width: 250px;
    height:;
    padding: 10px 10px;
    margin:0 0 15px 0;
    background: #FFF url() no-repeat;
    /* DROP Shadow 
    -moz-box-shadow: 3px 3px 4px #ccc;
    -webkit-box-shadow: 3px 3px 4px #ccc;
    box-shadow: 3px 3px 4px #ccc;
    */
}

谢谢你看看。

Answer 1

它编码严重的CSS！但是盒子不合适的问题是facebook喜欢按钮扩大到你指定的保证金数量太宽。

也不要把分析放在最顶层你把它放在底部，加上你遗漏的doctype

 <!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>Untitled Document</title>
    </head>

    <body>
<!--content ect-->

<!--analytics-->
    </body>
    </html>

为什么这不适用于Internet Explorer 9？

1 个答案: