First of all I am new here so hello to all! I am having a problem with my css. I have no idea what i am doing wrong. The flash object looks good in FF but it breaks the layout in IE http://photofun.no-ip.org/test/ anyone care to take a look? (as you can see from the code I am not quite a designer or developer...just a hobbyist ) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>H.I. Fotografie</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <meta name="generator" content="HAPedit 3.1"> <link href="style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="swfobject.js"></script> </head> <body> <div id="container"> <div id="header"><img src="images/logo.jpg" alt="logo" /></div> <div id="wrapper"> <div id="content"> <div id="player"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player. <script type="text/javascript"> var s1 = new SWFObject("imagerotator.swf","rotator","340","335","7"); s1.addVariable("file","playlist-image.php"); s1.addVariable("shownavigation","false"); s1.addVariable("overstretch","none"); s1.addVariable("autostart","true"); s1.addVariable("shuffle","true"); s1.addVariable("rotatetime","15"); s1.addVariable("transition","fade"); s1.write("player"); </script> </div> </div> </div> <div id="navigation"> <ul> <li id="active"><a href="/">Home</a></li> <li><a href="#">Over ons</a></li> <li><a href="#">Werkwijze</a></li> <li><a href="#">Klanten</a></li> <li><a href="#">Contact</a></li> <li><a href="#">Portfolio</a></li> </ul> </div> <div id="extra"> <h3>Welkom</h3> <p>...Fotografie ....</p> </div> <div id="footer"><p>H I F | .......... | .........</p></div> </div> </body> </html> Code (markup): /*------------------------------------------------------------ GENERAL ------------------------------------------------------------*/ html,body { margin-top: 40px; padding:0; } body { font: 76% arial,sans-serif; text-align:center; background: #111; } /*------------------------------------------------------------ PAGE STRUCTURE ------------------------------------------------------------*/ #header { height:80px; margin:0; padding-left:10px; background-image: url(images/logo.jpg); background-repeat: no-repeat; background: #333333; border-bottom: 1px solid #94C2E5; } #wrapper { float:left; width:100%; } #container { width:740px; margin:0 auto; text-align:left; color: #94C2E5; background:#222222; } #navigation { float:left; width:130px; margin-left:-740px; /*Set left margin to -(ContainerWidth)*/ background:#222222; } #extra { float:left; width:210px; margin-left:-610px; /*Set right margin to -(ContainerWidth - NavigationWidth)*/ background:#222222; } #content { float:left; margin-left: 340px; /*Margin for content column. Should be (ExtraWidth + NavigationWidth)*/ min-height: 400px; } #contentwide { float:left; margin-left: 130px; min-height: 400px; } #footer { background: #333; color: #FFF; clear: left; width: 100%; border-top: 1px solid #94C2E5; } * html #centercolumn {height:400px} /* IE Min-Height Hack */ /*------------------------------------------------------------ OTHER TEXT AND PARAGRAPH STYLES ------------------------------------------------------------*/ h3 { margin-top: 20px; color: #FFFFFF; } p { margin-top: 10px; margin-right: 10px; margin-bottom: 10px; } #content p { line-height: 1.4; } #footer p { margin:0; padding-top: 5px; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; } a { color: #FF6600; text-decoration: none; } #navigation a { text-decoration: none; color: #ffffff; } #navigation a:hover { text-decoration: none; color: #FF6600; } #navigation a:active { text-decoration: none; color: #FF6600; } #navigation ul { list-style: url(images/menu.jpg); margin-top: 20px; } /*------------------------------------------------------------ IMAGES, FLASH, TABLES ------------------------------------------------------------*/ #player { float: left; margin-top: 20px; margin-left: 20px; border: 1px solid #94C2E5; } #table { margin-left: 10px; margin-right: 10px; } Code (markup):