anks Posted May 21, 2010 Share Posted May 21, 2010 Folks, http://terrygoodkind.co.uk CSS: http://terrygoodkind.co.uk/themes/ocean/style.css The body content and sidebar are left aligned, I want em to be Center aligned in both the browsers IE n FF. Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/ Share on other sites More sharing options...
jacko310592 Posted May 21, 2010 Share Posted May 21, 2010 try setting a width to the main container (the div which holds the entire webpage- if you haven’t got one yet, try adding one) then add the following margin property to your CSS #mainContainer { width: 950px; /*Or whatever*/ margin: 0 auto /*Centres div#mainContainer*/ } then put this doctype at the top of your HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ..a valid doctype is mainly required by IE Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061536 Share on other sites More sharing options...
haku Posted May 21, 2010 Share Posted May 21, 2010 Add: margin:0 auto; to #content Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061612 Share on other sites More sharing options...
anks Posted May 21, 2010 Author Share Posted May 21, 2010 try setting a width to the main container (the div which holds the entire webpage- if you haven’t got one yet, try adding one) then add the following margin property to your CSS #mainContainer { width: 950px; /*Or whatever*/ margin: 0 auto /*Centres div#mainContainer*/ } then put this doctype at the top of your HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> ..a valid doctype is mainly required by IE Dear Jacko, As you asked, i have added, may you have a look at site, post adding those codes: Open in Firefox: http://terrygoodkind.co.uk/ Observe the Not so good looking "Shop All Departments" Links, which are overlapping wiht the Post Content. Any solution for that? 2- Open the site in IE and you can see that Content is Still Left Aligned. Best Regards, Anks Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061632 Share on other sites More sharing options...
anks Posted May 21, 2010 Author Share Posted May 21, 2010 Add: margin:0 auto; to #content Thanks Haku... It center Aligned in FF but in IE its still the same Left aligned. http://terrygoodkind.co.uk/ Thanks Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061633 Share on other sites More sharing options...
jacko310592 Posted May 21, 2010 Share Posted May 21, 2010 your left align problem in IE is coming from javascript (niftycube.js), something to do with the javascript in there seems to be overriding the CSS property of margin: 0 auto. what is this javascript for? is it needed? with the department links: firstly, you need to put a <ul> </ul> around the <li>'s to make it valid HTML secondly, you could add some padding or a margin to move them away from the side. eg: HTML: <ul id="departments"> <li><a href='paintball-guns-for-beginners.htm'>Paintball Guns For Beginners</a></li> <li><a href='paintball-hose-line.htm'>Paintball Hose Line</a></li><li><a href='paintball-hopper-300.htm'>Paintball Hopper 300</a></li> (etc etc..) </ul> CSS: #departments { margin: 0 10px; /*Or what ever amount needed*/ } regards Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061653 Share on other sites More sharing options...
anks Posted May 21, 2010 Author Share Posted May 21, 2010 your left align problem in IE is coming from javascript (niftycube.js), something to do with the javascript in there seems to be overriding the CSS property of margin: 0 auto. what is this javascript for? is it needed? with the department links: firstly, you need to put a <ul> </ul> around the <li>'s to make it valid HTML secondly, you could add some padding or a margin to move them away from the side. eg: HTML: <ul id="departments"> <li><a href='paintball-guns-for-beginners.htm'>Paintball Guns For Beginners</a></li> <li><a href='paintball-hose-line.htm'>Paintball Hose Line</a></li><li><a href='paintball-hopper-300.htm'>Paintball Hopper 300</a></li> (etc etc..) </ul> CSS: #departments { margin: 0 10px; /*Or what ever amount needed*/ } regards I have renamed the niftycubes.js so that it can not be called, it seems still in IE its LEft aligned. But, accept my sincere Thanks!!! Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061672 Share on other sites More sharing options...
jacko310592 Posted May 21, 2010 Share Posted May 21, 2010 how strange, i did the same thing, but it stopped being left aligned for me just to make sure, try removing all javascript to see if it starts being centred. if it then works, one by one add the scripts back to see which is causing the problem. just about to have my tea now, but ill also have a deeper look into this once im back (: Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061674 Share on other sites More sharing options...
jacko310592 Posted May 21, 2010 Share Posted May 21, 2010 unfortunately, after looking some more, the only problem i can find is with the 'niftycube.js' javascript; once i removed that from the test area (renamed it) it worked fine for me in IE (tested on IE8 + IE7) sorry i couldnt be anymore help best regards Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061684 Share on other sites More sharing options...
anks Posted May 21, 2010 Author Share Posted May 21, 2010 Jacko, Appreciate your reply. Will try to remove the JS and retest. One more thing, http://terrygoodkind.co.uk/index.php?page=about It slides down the Sidebar, any way that sidebar does not fall down? Hope you have a wonderful tea!!! Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061691 Share on other sites More sharing options...
jacko310592 Posted May 21, 2010 Share Posted May 21, 2010 hmm, you could try adding to your CSS: #footer { clear: both; } and thank you (: Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061696 Share on other sites More sharing options...
anks Posted May 21, 2010 Author Share Posted May 21, 2010 hmm, you could try adding to your CSS: #footer { clear: both; } and thank you (: Ok, as you asked, i added this code in existing #footer #footer { text-align: center; padding: 0px 20px 27px 21px; margin-top: 60px; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; border-top-style: double; border-top-color: #666; border-right-color: #666; border-bottom-color: #666; border-left-color: #666; clear: both; } Still.... No Luck.. http://terrygoodkind.co.uk/index.php?page=about Rgrds Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061703 Share on other sites More sharing options...
anks Posted May 22, 2010 Author Share Posted May 22, 2010 Ops..... IE if driving me Crazy..... IE should be Forbidden.. lol Its looks so bad now in IE.... http://terrygoodkind.co.uk/index.php?kw=Paintball&p1=TIPPMANN-Low-Profile-Bulk-Cyclone-Hopper&p2=B000X04RJM While it looks fine in FF... What the heck is going wrong? Jacko, can you help please? Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061880 Share on other sites More sharing options...
jacko310592 Posted May 22, 2010 Share Posted May 22, 2010 it seems i cannot really help you anymore than i can.. once i copied your HTML and CSS documents to my local dir, all i had to do to get the page to display correctly within IE was to ad the following doctype to the very top of the HTML doc: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> and remove that javascript file i said about before; then for me, it looked just like in FF.. (appart from in every other browser appart from IE, there is a broken HTML comment which shows up at the top of the page, which says "TAGLINE") sorry i couldnt be anymore help anks, hope you get it looking right as you want it soon Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061912 Share on other sites More sharing options...
anks Posted May 22, 2010 Author Share Posted May 22, 2010 it seems i cannot really help you anymore than i can.. once i copied your HTML and CSS documents to my local dir, all i had to do to get the page to display correctly within IE was to ad the following doctype to the very top of the HTML doc: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> and remove that javascript file i said about before; then for me, it looked just like in FF.. (appart from in every other browser appart from IE, there is a broken HTML comment which shows up at the top of the page, which says "TAGLINE") sorry i couldnt be anymore help anks, hope you get it looking right as you want it soon Dear Jacko, Thanks for the good words! I have added the DOCTYPE code and removed the JS you mentioned (Niftycubes.js). Seems like, IE is not happy with me, in person. and its too stubborn to work as required. lol I am PMing you the index.php for a quick look.. Best Rgrds, Anks Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1061925 Share on other sites More sharing options...
anks Posted May 23, 2010 Author Share Posted May 23, 2010 it seems i cannot really help you anymore than i can.. once i copied your HTML and CSS documents to my local dir, all i had to do to get the page to display correctly within IE was to ad the following doctype to the very top of the HTML doc: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> and remove that javascript file i said about before; then for me, it looked just like in FF.. (appart from in every other browser appart from IE, there is a broken HTML comment which shows up at the top of the page, which says "TAGLINE") sorry i couldnt be anymore help anks, hope you get it looking right as you want it soon The index.php does not cosist only HTML Tags but PHP codes as well, which is why i PMed you the index.php Codes. Another thing is, i can live up with the Left alignment of page in IE, but the right sidebar is sliding at the bottom in IE and works fine in FF. Open in IE: http://terrygoodkind.co.uk/index.php?kw=Paintball&p1=Paintball-Xtreme-Rage-Xray-Single-Lens-Anti-Fog-Mask&p2=B0014UWJJ0 Thanks Jacko!!! Quote Link to comment https://forums.phpfreaks.com/topic/202462-page-content-not-getting-center-aligned/#findComment-1062139 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.