SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Threaded View

  1. #1
    I, Human FTIGraphix's Avatar
    Join Date
    Apr 2003
    Location
    Utah
    Posts
    150
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Divs not working inside Divs in Firefox

    I'm pretty new to this but I'm trying to code with web standards (strick xhtml and css). I've attached two pictures below - one of the site in IE (which looks great) and the other in Firefox (which is having problems). The problem seems to be Firefox not recognizing the div. Feel free to enlighten me on other problems as well =) Here's the code:

    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>USU Replication</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" href="css.css" type="text/css" />
    </head>
     
     
    <body>
     
    <div id="main">
     
    <div id="second">
     
    <p id="third">
    <img src="images/logo.jpg" alt="USU Logo"/>
    </p>
     
    <p id="fourth">
    <a href="home.html">USU Home </a><a href="home.html">A-Z Index </a><a href="home.html">Calendars </a><a href="home.html">MyUSU </a>
    <a href="home.html">Contact </a><a href="home.html">people/web search</a>
    </p>
    </div>
     
    <div id="fifth">
     
    <h3 class="toplinks"><a href="home.html">Future Students </a></h3><h3 class="toplinks"><a href="home.html">Current Students </a>
    </h3><h3 class="toplinks"><a href="home.html">Alumni &amp; Friends </a> </h3><h3 class="toplinks"><a href="home.html">Faculty &amp; Staff </a></h3><h3 class="toplinks"><a href="home.html">Community &amp; Vistors</a></h3>
     
    </div>
     
    <div id="mainpic">
      <a href="http://www.usu.edu/cob"><img src="images/extension_anniversary.jpg" alt="One Hundred Years!" /></a>
    </div>
     
    <div id="welcome">
    <h6>Welcome</h6>
    <ul>
    <li>About USU</li>
    <li>Parents</li>
    <li>Regional Campuses</li>
    <li>Student Life</li>
    <li>Visit the Campus</li>
    </ul>
    </div>
     
    </div>
    <p>
        <a href="http://validator.w3.org/check?uri=referer"><img
            src="http://www.w3.org/Icons/valid-xhtml10-blue"
            alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a>
      </p>
    <p>
     <a href="http://jigsaw.w3.org/css-validator/check/referer">
      <img style="border:0;width:88px;height:31px"
           src="http://jigsaw.w3.org/css-validator/images/vcss" 
           alt="Valid CSS!" />
     </a>
    </p>
     
    </body>
    </html>


    Code CSS:
    @charset "utf-8";
    /* CSS Document */
     
    body {background-color: #D5DDDA;}
     
    #main {background-color: #FFFFFF;
    	   width: 758px;
    	   margin: auto;}
     
    #second {background-color: #003366;
    		  background-image: url(images/header_bg.jpg);
    		  background-repeat: no-repeat;
    		  background-position: right;
    		  margin: 4px 5px 0 5px;
    		  width: 749px;}
     
    #third {float: left;}
     
    #fourth {float: right;
    		margin: 10px 30px;}
     
    #fourth a:link, #fourth a:visited {color: #BFBFFF;
    		   		font-family: Arial, Helvetica, sans-serif;
    		   		font-size: 12px;
    				text-decoration: none;}
     
    #fourth a:hover {color: #FFFFFF;}
     
    #fifth {background-color: #0054A8;
    		width: 749px;
    		clear: both;
    		margin: 1px 5px 2px 5px;
    		height: 20px;}
     
    #fifth a:link, #third1 a:visited {color: #FFFFFF;
    					font-family: Arial, Helvetica, sans-serif;
    					font-size: 12px;
    					text-decoration: none;
    					font-weight: bold;}
     
     
    .toplinks {float: left;
    		   margin: 2px 5px 0 2px;}
     
    .toplinks a:hover {background-color:#003366;}
     
    #mainpic {width: 749px;
    		  margin: 1px 5px 0 5px;
    		  clear: both;}
     
    #welcome {background-color: #2F26D9; 
    		  background-image: url(images/blue_logo_bg.jpg);
    		  background-position: bottom;
    		  background-repeat: no-repeat;
    		  color: #FFFFFF;
    		  font-family: Arial, Helvetica, sans-serif;
    		  font-size: 12px;
    		  clear: both;
    		  width: 150px;
    		  margin: 1px 1px 1px 5px;
    		  text-align: left;}
     
    h6 {font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: bold;}
     
    ul {list-style-type: none;
    	list-style-position: outside;
    	text-align: left;
    	float: left;
    	margin-left: 0px;}
    Attached Images Attached Images
    Last edited by FTIGraphix; Sep 21, 2007 at 20:35.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •