August 1, 201214 yr Hi all, im probably being stupid. But my website container wont center. #container { border: 1px dashed #9b1c26; margin: auto; float:left; height: auto; background-repeat: repeat-y; padding: 10px; width: 800px; } any ideas? Edited August 1, 201214 yr by Renaissance-Design Please use the code button or tags to format your code.
August 1, 201214 yr Author Remove "float:left" ... you want it centre, not to float. Thanks but ive tried both of those already. its really odd, got the same code on another part of the website.
August 1, 201214 yr Thanks but ive tried both of those already. its really odd, got the same code on another part of the website. margin:0 auto; The above should do it, like people have said.. You don't need the float:left; either. If it isn't working, copy in the whole code you are using so we can see Edited August 1, 201214 yr by wdh
August 1, 201214 yr Author <html> <head><title>A&R Porter - Please upgrade your browser</title> <style type="text/css"> body { margin: 0; } p { font-family: sans-serif; font-weight: bold; font-size:12px; color: #333; } a { text-decoration: none; font-family: sans-serif; font-weight: bold; font-size:12px; color: #333; } a:hover { text-decoration: underline; font-family: sans-serif; font-weight: bold; font-size:12px; color: #333; } img { float: left; margin-left: 25px; } #container { border: 1px dashed #9b1c26; margin: 50px auto; height: auto; background-repeat: repeat-y; padding: 10px; width: 800px; } #bottom_text { float: left; width: 400px; margin-top: 30px; } #details { float: left; margin-top: 30px; width: 350px; padding-left: 40px; } </style> </head> <body> <div id="container"> <p>We are sorry you are unable to access the full website, We highly recommend you upgrade your browser as microsoft are now finished offering support for your browser.</p> <p>Why not try one of the following, They are quicker, more user friendly and over all offer a much better experience.</p> <p>Browsers</p> <a href="https://www.google.com/chrome"><img src="Images/Browser/chrome.jpg" border="0" width="125" height="125"></a> <a href="http://www.apple.com/safari/"><img src="Images/Browser/firefox.jpg" border="0" width="125" height="125"></a> <a href="http://www.microsoft.com/en-us/download/ie.aspx?q=internet+explorer&WT.mc_id=MSCOM_EN_US_DLC_ICONNAV_121LSUS007796"><img src="Images/Browser/ie.jpg" border="0" width="125" height="125"></a> <a href="http://www.opera.com/download/"><img src="Images/Browser/opera.jpg" border="0" width="125" height="125"></a> <a href="http://www.apple.com/safari/"><img src="Images/Browser/safari.png" border="0" width="125" height="125"></a> <div id="bottom_text"> <p>We hope that information helps you to keep your browser up to date.</p> <p>If you wish to contact us, Please see the details to the right;</p> </div> <div id="details"> <p>Ashford Head Office & Showroom</br> T:</br> E:</br> Click here for Address and Map</p> </br> <p>Weybridge Showroom</br> T:</br> E:</br> Click here for Address and Map</p> </div> </div> </body> </html> Edited August 1, 201214 yr by Renaissance-Design Please use the code button or tags to format your code.
August 1, 201214 yr Author margin:0 auto only works if you specify width width:500px; margin:0 auto; apologies, width is already specified as 800px;
August 1, 201214 yr I think your page is rendering in quirks mode. Try adding this line above <html>: <!DOCTYPE html>
August 1, 201214 yr Author I think your page is rendering in quirks mode. Try adding this line above <html>: <!DOCTYPE html> Just clocked it as i got ur email. Thanks mate. il plus one you anyway. Cheers
Create an account or sign in to comment