Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

  1.  permalink
    the div outer border only wraps half way around in Firefox and also the footer div is not showing in Firefox whereas all works fine in Internet Explorer.

    Here's the code for the page:

    /**************************************************************

    <!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=iso-8859-1" />
    <title>Untitled Document</title>

    <link rel ="stylesheet" href="chrometheme/chromestyle.css" type="text/css" />



    <style type="text/css">

    #outer{
    width:651px;
    border:1px solid gray;
    }

    #logo{
    float:left;
    width:150px;
    height:140px;
    border-right:1px dotted black;
    background-color:blue;
    margin-bottom:0px;
    }

    #movie{
    float:left;
    width:500px;
    height:140px;
    margin-bottom:0px;
    }

    #nav{
    width:651px;
    height:10px;
    background-color:yellow;
    margin-top:0px;
    }

    ul#menu{
    margin-top:0px;
    }


    ul#menu li{
    display:inline;
    }

    ul#menu li a{
    text-decoration:none;
    }

    #content{
    float:left;
    width:500px;
    height:400px;
    background-color:#FFFF33;
    }

    #right{
    float:left;
    width:151px;
    height:400px;
    background-color:#660066;
    }

    #footer{
    width:651px;
    height:25px;
    background-color:red;
    }


    </style>

    </head>
    <body>

    <div id ="outer">
    <div id = "logo">

    </div>
    <div id = "movie">
    <object width="500" height="140">
    <param name="movie" value="slideshow.swf">
    <embed src="slideshow.swf" width="500" height="140"> </embed>
    </object>
    </div>
    <div class="chromestyle" id="chromemenu">
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#" rel="dropmenu1">Services</a></li>
    <li><a href="#">Contact</a></li>
    </ul>
    </div>

    <!--1st drop down menu -->
    <div id="dropmenu1" class="dropmenudiv">
    <a href="http://www.dynamicdrive.com/">Dynamic Drive</a>
    <a href="http://www.cssdrive.com">CSS Drive</a>
    </div>

    <script type="text/javascript">

    cssdropdown.startchrome("chromemenu")

    </script>

    <div id ="content">

    </div>

    <div id = "right">

    </div>

    <div id = "footer">

    </div>
    </div>
    </body>
    </html>

    *****************************************************************/

    I'd be grateful for any help/suggestions with a view to resolving this issue.

    I thank you for your time.
  2.  permalink
    #footer{
    clear:both;/* so the footer clears the floated divs */
    width:651px;
    height:25px;
    background-color:red;
    }
Add your comments
    Username Password
  • Format comments as (Help)