Here is my website: www.xigencemedia.com/beta For some reason, in IE 7 the right side just goes below the left side rather then actually being on the right where it is supposed to be. But in firefox, it looks perfect. Can anyone suggest some help? XHTML CODE: <!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>Xigence Media</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script src="rotate.js" type="text/javascript"></script> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin image1 = new Image(); image1.src = "images/o_02.png"; image2 = new Image(); image2.src = "images/o_03.png"; image3 = new Image(); image3.src = "images/o_04.png"; image4 = new Image(); image4.src = "images/o_05.png"; // End --> </script> <style type="text/css"> *{border:none} input { background-color: #3e3e3e; color: #666666; } textarea { background-color: #3e3e3e; color: #666666; } </style> <!--[if IE 7]> <link href="ie7.css" rel="stylesheet" type="text/css" /> <![endif]--> </head> <body> <center> <div id="container"> <div id="header"> <img src="blank.png"><img src="blank.png"><img src="blank.png"><img src="blank.png"><img src="blank.png"><a href="index.html" onmouseover="image1.src='images/o_02.png';" onmouseout="image1.src='images/xmediav5_02.png';"> <img name="image1" src="images/xmediav5_02.png" border=0></a> <a href="#portfolio" onmouseover="image2.src='images/o_03.png';" onmouseout="image2.src='images/xmediav5_03.png';"> <img name="image2" src="images/xmediav5_03.png" border=0></a> <a href="#services" onmouseover="image3.src='images/o_04.png';" onmouseout="image3.src='images/xmediav5_04.png';"> <img name="image3" src="images/xmediav5_04.png" border=0></a> <a href="#contact" onmouseover="image4.src='images/o_05.png';" onmouseout="image4.src='images/xmediav5_05.png';"> <img name="image4" src="images/xmediav5_05.png" border=0></a> </div> <br /> <img src="images/xmediav5_08.png"><br /> <div id="left"> <div id="title"> <div class="titlec">AFFORDABLE SOLUTIONS, 100% UNIQUE WORK.</div> </div> <div class="content"> We produce some of the finest websites for our customers, all of which are 100% custom and unique websites. We aim for customer satisfaction and will do whatever it takes to make our clients happy. We create almost any kind of website; Gaming, buisness, organization, or personal, we make them all. Besides offering design solutions, we also offer coding services as well, giving it the final touch it needs.<br /><br /> Use our contact form to request a free quote on a website from Xigence Media.<br /><br /> At Xigence Media we never over-price our work, we make sure it's affordable for our clients. Even in the most amazing websites, we do not believe in over-pricing. We make sure that our clients get the best website for the perfect price. We are always looking for a way to aim towards the best of customer satisfaction.<br /><br /> All of our work is 100% unique, and we'll never be sold again. You have full rights to the website, and can always come back for support whenever you need assistance with your website. We never let you down. Our staff never slacks off and uses all time possible to get your website complete. If you don't like the way your website is turning out, we will never give up, we will continue to work on your website until you are completely satisfied!<br /><br /> We even have more services to offer to you. We also work in the area of professional myspace layouts. We work myspace layouts to the best of our ability to give you a stunning new myspace look. Use our contact form for more information on our fully custom layouts.<br /><br /> In total, we offer complete web design layouts (PSD), xhtml/css coding, & unique myspace layouts.<br /><br /> </div> <div id="title2"> <div class="titled">- WEB DESIGN</div> </div> <br /><br /><br /> <div class="content2"> All of our layouts that we create are in .PSD format and are made with ease to make it easier for you to find the layers you need to change your website. All of our layouts are 100% unique and will never be sold again. These layouts run around $75 - $95 US dollars depending on the size and quality of the project.<br /><br /> </div> <div id="title2"> <div class="titled">- XHTML/CSS CODING</div> </div> <br /><br /><br /> <div class="content2"> We are always prepared to code your website with simplicity. We code all of our websites in XHTML/CSS, making it very easy for you to navigate throughout your website files and change certain portions with ease. We are also ready to add nice, smooth, professional css effects to your website, giving it the touch it needs to become a true, professional website. We guarentee an amazing website in the end with our professional coding. Most coding jobs run around $50 - $80 US dollars. </div> <div id="title2"> <div class="titled">- UNIQUE MYSPACE LAYOUTS</div> </div> <div class="content2"> Besides offering fully developed website services, we go even farther and offer superb myspace themes/layouts. We provide full custom div overlays to give your myspace layout the touch it needs. These myspace layouts run from $200 - $400 US dollars depending on the size of the project. Don't hesitate to get in touch with us if this does not fit your budget, we'd be glad to help. </div> <br /> <div id="title"> <div class="titlec">OUR PORTFOLIO <font color="#727272">(CLICK IMAGE TO VIEW FULL LAYOUT)</font></div> </div> <div id="port"> <br /><br /><br /><br /> <div id="slideshow"> <a style="position: absolute; display: block; z-index: 6;" href="http://xigencemedia.com/portfolio/Websites/Gaming%20Teams/Team%20DoubleTake/doubletake.png"><img src="images/dt.png"alt="Featured" /></a> <a style="position: absolute; display: block; z-index: 4;" href="http://xigencemedia.com/portfolio/Websites/Gaming%20Teams/Malice%20Gaming/malice.png"><img src="images/ma.png" alt="Featured" /></a> <a style="position: absolute; display: block; z-index: 3;" href="http://xigencemedia.com/portfolio/Websites/Gaming%20Teams/Shocked%20Gaming/shockedgaming.png"><img src="images/sh.png" alt="Featured" /></a> <a style="position: absolute; display: block; z-index: 2;" href="#portfolio"><img src="http://fc27.deviantart.com/fs33/i/2008/307/f/f/DJ_1mP_by_bfblackjack.png" alt="Featured" /></a> <a style="position: absolute; display: block; z-index: 1;" href="http://xigencemedia.com/portfolio/Websites/Server%20Companies/Amped%20Servers/amped.png"><img src="images/am.png" alt="Featured" /></a> </div> </div> <br /> </div> </div> <div id="right"> <div class="content3"> <img src="images/bar_05.png"><br /> <form method="POST" action="mailer.php"> <INPUT NAME="op" TYPE="hidden" VALUE="send"> <table> <tr> <td width="39"><p><font color="#666666" size="-2" face="Tahoma">Name:</font></p></td> <td width="200"> <input name="name" type="text" size="30" maxlength="150"> </td> </tr> <tr> <td><p><font color="#666666" size="-2" face="Tahoma">Email:</font></p></td> <td> <input name="email" type="text" size="30" maxlength="150"> </td> </tr> <tr> <td valign="top"><p><font color="#666666" size="-2" face="Tahoma">Message:</font></p></td> <td><textarea name="message" cols="32" rows="4"></textarea></td> </tr> <tr><td></td> <td><input name="submit" type="submit" value="SUBMIT"></td><p align="center"><font size="-2"><a href=""></a></font></p></tr> </table> </form> <br /> <img src="images/bar_10.png"><br /><br /> Xigence Media was founded in April 2007 by Alex Johnson. Alex wanted to pursue a side-job in web development, and so he did. He taught himself to design & code professional websites. In January 2008 Paul Healy was aded to to the team as a coder. Xigence Media has gradually developed from a small-owned buisness to a large media development agency, and still continues to grow day by day.<br /><br /> <img src="images/bar_14.png"><br /> <br /> <a href="http://fc38.deviantart.com/fs37/i/2008/286/c/1/Malice_Gaming_by_bfblackjack.png" title="Malice Gaming"><img src="images/fav_01.png"></a> <a href="http://fc53.deviantart.com/fs36/i/2008/286/3/a/Find_A_Clan_by_bfblackjack.png" title="Find A Clan"><img src="images/fav_02.png"></a> <a href="http://fc23.deviantart.com/fs34/i/2008/300/b/9/Team_Double_Take_by_bfblackjack.png" title="Team Doubletake"><img src="images/fav_03.png"></a> <a href="http://fc27.deviantart.com/fs33/i/2008/307/f/f/DJ_1mP_by_bfblackjack.png" title="DJ 1mP"><img src="images/fav_04.png"></a> <a href="http://fc14.deviantart.com/fs38/i/2009/002/c/5/Shocked_Gaming_by_bfblackjack.png" title="Shocked Gaming"><img src="images/fav_05.png"></a> <a href="http://fc09.deviantart.com/fs35/i/2008/302/d/9/Disturbed_Gaming__PRE_MADE__by_bfblackjack.png" title="Disturbed Gaming"><img src="images/fav_06.png"></a> <a href="http://fc47.deviantart.com/fs38/i/2008/359/e/1/Amped_Servers_by_bfblackjack.png" title="Amped Servers"><img src="images/fav_07.png"></a> <a href="http://fc22.deviantart.com/fs36/i/2008/286/8/d/Frag_Xpress_Voice_by_bfblackjack.png" title="Frag-Xpress"><img src="images/fav_08.png"></a> </div> </div> <div id="footer"> <img src="images/xmediav5_25.png"> </div> </div> </body> </html> HTML: CSS: img { border: 0px; } a:link { color: #fffff; text-decoration: none; } a:visited { color: #fffff; text-decoration: none; } a:active { color: #014d8e; text-decoration: none; } a:hover { color: #014d8e; text-decoration: none; font-weight: bold; } span { color: red; font-weight: bold; } body { background-image: url(images/bg.png); background-repeat: repeat-x; background-color: #2a2a2a; font-family: tahoma; color: #000000; margin: 0px; padding: 0px; } .content { margin: 0 0 0 53px; font-size: 10px; color: #fff; padding: 0px; } .content3 { margin: 0 0 0 20px; font-size: 10px; font-family: Arial; color: #858585; padding: 0px; } #port { background-image: url(images/port.png); margin: 0 0 0 23px; font-size: 10px; color: #fff; padding: 0px; width: 688px; height: 290px; } .content2 { margin: 0 0 0 83px; font-size: 10px; color: #fff; padding: 0px; width: 600px; } .titlec { padding-top: 9px; margin: 0 0 0 37px; font-size: 10px; color: #fff; height: 36px; } .titled { padding-top: 17px; margin: 0 0 0 37px; font-size: 10px; color: #fff; height: 36px; } #title { margin: 0 0 0 15px; width: 704px; height: 36px; float: left; background-image: url(images/xmediav5_13.png); } #title2 { margin: 0 0 0 45px; width: 639px; height: 48px; float: left; background-image: url(images/xmediav5_17.png); } #container { margin-left:auto; margin-right:auto; text-align: left; width: 1200px; } #header { width: 1200px; height: 72px; background: url(images/xmediav5_01.png); font-size: 10px; } #left { width: 725px; float: left; padding-top: 11px; background-color: #414141; } #right { width: 330px; float: left; padding-top: 11px; padding-left: 3px; } #footer { background-image: url(images/xmediav5_25.png); background-repeat: repeat-x; height: 59px; float: left; font-size: 10px; color: #fff; margin: 0px 0 0 112px; } #slideshow, #slideshow2{position: relative; width: 668px; height: 240px; margin: 0 auto; padding: 0; } #slideshow img, #slideshow2 img{position: absolute; width: 668px; height: 240px; top: 0; left: 0;} #slideshow a{position: absolute; width: 668px; height: 240px; top:0; left: 0;} Code (markup): Any help is appreciated, thanks.
Hi, It might just be the search-function of my comp but you never closed <center>. To be quite honoust, I shouldn't use this in combination with your div's. You lined #left and #right up next to each other by floating them both to the left. Just use some positioning to get in the middle.. for you that would be: #container{ position: relative; left: 50%; top: 0px; /*relative nudges your site down a bit, use negative value*/ margin: 0px 0px 0px -600px; /*1200 is your width*/ }
I tryed that code and it didn't work out to well, but I took your advice on the floats and... On the right div, I changed the CSS to float: right and now it is floating on the right side, but it's still at the bottom of the page, not the top. Anyone have a suggestion for that?
You won't get them next to each other with one floating left and the other right.. You r pro web creator?
I'm not much of a div's person. I'm just starting to use div's thats why I'm having a bit of a trouble here
If you are using paddings, IE and FF render them differently. That could be your problem, drop the width of the box you want to stay on top to something really low and see if it stays there, then increase it till it gets bumped back down and you will know how big you can make it. Or change the width of another div till it fits if this is your problem. Take care.