Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Dec 2008
    Posts
    95
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Surprise!! site not working in IE6 (float problem)

    Working on a project, everything going great, look at it in IE6...spend whole night trying to fix it. I am having some sort of float issue, which I'm sure many someones out there know how to solve but i don't. I've attached a link to the site (http://tstcareertech.org/), a screenshot in ie6, html, and css. Any suggestions?



    html:
    Code:
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script language="javascript">AC_FL_RunContent = 0;</script>
    <script src="video/AC_RunActiveContent.js" language="javascript"></script>
    <title>Untitled Document</title>
    <link rel="stylesheet" type="text/css" href="css.css"/>
    </head>
    
    <body>
    
    
      <div id="wrapper">
    
    
        <div id="header">
    
    	<a href="#" class="banner"><img src="images/banner.jpg" width="540" height="61" alt="OPEN HOUSE MARCH 19 2009" />
    
            <p>JOIN US FOR OUR ANNUAL COMMUNITY</p>
            <p>OPEN HOUSE MARCH 19 2009</p>
    	<p>click here for details</p></a>
    
          <img class="logo" src="images/logo.gif" alt="TST BOCES Career & Tech Center" />
    
        </div>
    
        <div id="nav1">
    
          <ul>
            <li><a href="#" class="greylink">ABOUT C&T</a></li>
            <li><a href="#" class="yellowlink">HOW TO ENROLL</a></li>
            <li><a href="#" class="greylink">NEWS</a></li>
            <li><a href="#" class="yellowlink">C&T EDUCATION</a></li>
            <li><a href="#" class="greylink">FACULTY</a></li>
            <li><a href="#" class="yellowlink">CONTACT US</a></li>
          </ul>
    
        </div>
    
    
        <div id="nav2">
    
          <ul>
            <li><a href="#" class="bluelink">NEW VISIONS</a></li>
            <li><a href="#" class="redlink">SKILLS USA</a></li>
            <li><a href="#" class="bluelink">WORLD OF WORK</a></li>
            <li><a href="#" class="redlink">CAREER & TECH PROGRAMS</a></li>
            <li><a href="#" class="bluelink">PHOTO GALLERY</a></li>
            <li><a href="#" class="redlink">TST CTE BLOG</a></li>
          </ul>
    
        </div>
    
    
        <div id="boxfloatright">
    
          <div id="welcome">
    
            <img class="welcomeheader" src="images/welcome.gif" alt="" />
    
            <p>Career & Tech students come from all the area high schools in Tompkins, Tioga and Seneca counties, and attend classes for the entire school year.</p>
            <p>
    Career & Technical Education complements a high school schedule while allowing students to find personal success in their academics.</p> 
    	<p>
    The Career & Tech Center is committed to &quot;closing the achievement gap&quot; by offering alternatives to traditional teaching.</p>
    
          </div>
    
        </div>
    
        <div id="maincontent">
    
          <img class="learning" src="images/learning.gif" alt="" />
     
          <div id="video">
    
    	<script language="javascript">
    	if (AC_FL_RunContent == 0) {
    		alert("This page requires AC_RunActiveContent.js.");
    	} else {
    		AC_FL_RunContent(
    			'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
    			'width', '454',
    			'height', '324',
    			'src', 'video/video',
    			'quality', 'high',
    			'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
    			'align', 'middle',
    			'play', 'true',
    			'loop', 'true',
    			'scale', 'showall',
    			'wmode', 'window',
    			'devicefont', 'false',
    			'id', 'video/video',
    			'bgcolor', '#a3a3a3',
    			'name', 'video/video',
    			'menu', 'true',
    			'allowFullScreen', 'false',
    			'allowScriptAccess','sameDomain',
    			'movie', 'video/video',
    			'salign', ''
    			); //end AC code
    	}
          </script>
          <noscript>
    	<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="454" height="324" id="video/video" align="middle">
    	<param name="allowScriptAccess" value="sameDomain" />
    	<param name="allowFullScreen" value="false" />
    	<param name="movie" value="video/video.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	<embed src="video/video.swf" quality="high" bgcolor="#ffffff" width="454" height="324" name="video" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    	</object>
          </noscript>
          
         </div>
    
        </div>
    
    
      </div>
    
    </body>
    </html>
    css:
    Code:
    body {
    background-color: #000000;
    }
    
    * {
    margin: 0;
    padding: 0;
    border: none;
    }
    
    #wrapper {
    width: 934px;
    margin: 0 auto;
    background-color: #000000;
    }
    
    #header {
    width: 934px;
    height: 160px;
    background-color: #000000;
    overflow: hidden;
    }
    
    	.banner {
    		float: right;
    		margin: 60px 0;
    	}
    
    	img.banner {
    		text-decoration: none;
    		outline: none;
    		border: none;
    		}
    
    	a.banner:Focus {
    		outline: none;
    	}
    
    	.banner p {
    		display: none;
    	}
    
    #nav1 {
    background-image: url(images/nav1bg.jpg);
    width: 934px;
    height: 27px;
    background-color: #5c5c5c;
    }
    
    #nav1 ul {
    list-style: none;
    margin: 0 0 0 0;
    padding: 3px 0 0 0;
    border: none;
    text-align: center;
    }
    
    #nav1 li {
    text-decoration: none;
    margin: 0 0 0 40px;
    display: inline;
    padding: 0;
    }
    
    #nav1 ul li a:Link, a:Active, a:Visited {
    font-family: Helvetica, "Myriad Pro", "Trebuchet MS", sans-serif;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    color: #c9c9c9;
    }
    
    #nav1 ul li a.greylink:Link, a.greylink:Active, a.greylink:Visited {
    color: #c9c9c9;
    }
    
    #nav1 ul li a.greylink:Hover {
    color: #f3f1f1;
    }
    
    #nav1 ul li a.yellowlink:Link, a.yellowlink:Active, a.yellowlink:Visited {
    color: #ffcb00;
    }
    
    #nav1 ul li a.yellowlink:Hover {
    color: #fee78d;
    }
    
    #nav1 ul li a:Hover {
    color: #5D95C1;
    }
    
    #nav1 ul li a:Focus {
    outline: none;
    }
    
    #nav2 {
    background-image: url(images/nav2bg.jpg);
    width: 934px;
    height: 32px;
    background-color: #FFFFFF;
    }
    
    #nav2 ul {
    list-style: none;
    margin: 0 0 0 15px;
    padding: 5px 0 0 0;
    border: none;
    text-align: center;
    }
    
    #nav2 li {
    text-decoration: none;
    margin: 0 0 0 15px;
    display: inline;
    padding: 0;
    }
    
    #nav2 ul li a:Link, a:Active, a:Visited {
    font-family: Helvetica, "Myriad Pro", "Trebuchet MS", sans-serif;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    color: #00356a;
    }
    
    #nav2 ul li a.bluelink:Link, a.bluelink:Active, a.bluelink:Visited {
    color: #00356a;
    }
    
    #nav2 ul li a.bluelink:Hover {
    color: #59aafa;
    }
    
    #nav2 ul li a.redlink:Link, a.redlink:Active, a.redlink:Visited {
    color: #521713;
    }
    
    #nav2 ul li a.redlink:Hover {
    color: #f13f33;
    }
    
    #nav2 ul li a:Hover {
    color: #5D95C1;
    }
    
    #nav2 ul li a:Focus {
    outline: none;
    }
    
    #boxfloatright {
    width: 319px;
    height: 340px;
    background-color: #a3a3a3;
    float: right;
    margin: 0 40px 0 0;
    }
    
    #welcome {
    width: 304px;
    height: 284px;
    background-color: #FFFFFF;
    margin-top: 25px;
    }
    
    #welcome p {
    font-family: Helvetica, "Myriad Pro", "Trebuchet MS", sans-serif;
    font-size: 13px;
    padding: 0 10px;
    line-height: 17px;
    margin-top: 8px;
    }
    
    #maincontent {
    width: 575px;
    height: 340px;
    background-color: #a3a3a3;
    }
    
    #maincontent img.learning {
    float: left;
    }
    
    #video {
    width: 454px;
    height: 299px;
    display: inline;
    margin: 0 15px;
    }
    
    img.logo {
    padding: 35px 0 0 95px;
    }
    
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0px;
    }

  • #2
    Regular Coder
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    263
    Thanks
    3
    Thanked 12 Times in 12 Posts
    Okay chief, first of all i think you wrote your markup incorrectly..

    i mean.. as i can see it.. the order you wrote/ built your page is somewhat awkward..

    well you see.. when building a page.. it's like building a house.. the roof is always on top and the walls are on the side to support.. in your case..

    i think i saw the roof like on the windows.. hehehe.. just kidding.. but seriously.. the way you wrote your page is just not in order.. to fix this..

    try this..

    see how i changed the positions of your main content div and the boxfloat right.. yeah.. since the main content which has the videos comes first in the layout.. you should put it on top of the boxfloatright which has the text contents.. next

    and the explanation on the problem your having, is that since the div which is floated to the right.. occupies the whole space.. in its' row.. that is why the videos are pushed way down.. even though it's floated to the left..


    Code:
    #maincontent{float:left;}
    #boxfloatright{float:left;}
    Code:
    <div id="maincontent">
    
          <img class="learning" src="images/learning.gif" alt="" />
    
     
          <div id="video">
    
    	<script language="javascript">
    	if (AC_FL_RunContent == 0) {
    		alert("This page requires AC_RunActiveContent.js.");
    	} else {
    		AC_FL_RunContent(
    			'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
    			'width', '454',
    			'height', '324',
    			'src', 'video/video',
    			'quality', 'high',
    			'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
    			'align', 'middle',
    			'play', 'true',
    			'loop', 'true',
    			'scale', 'showall',
    			'wmode', 'window',
    			'devicefont', 'false',
    			'id', 'video/video',
    			'bgcolor', '#a3a3a3',
    			'name', 'video/video',
    			'menu', 'true',
    			'allowFullScreen', 'false',
    			'allowScriptAccess','sameDomain',
    			'movie', 'video/video',
    			'salign', ''
    			); //end AC code
    	}
          </script>
          <noscript>
    	<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="454" height="324" id="video/video" align="middle">
    	<param name="allowScriptAccess" value="sameDomain" />
    	<param name="allowFullScreen" value="false" />
    	<param name="movie" value="video/video.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	<embed src="video/video.swf" quality="high" bgcolor="#ffffff" width="454" height="324" name="video" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    	</object>
          </noscript>
          
         </div>
    
        </div>
    
    
    
        <div id="boxfloatright">
    
          <div id="welcome">
    
            <img class="welcomeheader" src="images/welcome.gif" alt="" />
    
            <p>Career & Tech students come from all the area high schools in Tompkins, Tioga and Seneca counties, and attend classes for the entire school year.</p>
            <p>
    Career & Technical Education complements a high school schedule while allowing students to find personal success in their academics.</p> 
    	<p>
    
    The Career & Tech Center is committed to &quot;closing the achievement gap&quot; by offering alternatives to traditional teaching.</p>
    
          </div>
    
        </div>

  • #3
    New Coder
    Join Date
    Dec 2008
    Posts
    95
    Thanks
    7
    Thanked 0 Times in 0 Posts
    Thanks! problem solved...I'm getting less stupid every day

  • #4
    Regular Coder
    Join Date
    Oct 2007
    Location
    Glencoe, Ontario, Canada
    Posts
    340
    Thanks
    19
    Thanked 27 Times in 27 Posts
    I wouldnt call it stupid, just inexperienced.
    Eric "PitbullMean" Melo
    Always Start your layout with*{border:0; margin:0; padding:0;}
    Be sure to Thank ALL Users who give assistance.


  •  

    Posting Permissions

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