Yeodan Posted April 26, 2009 Share Posted April 26, 2009 I've been searching for like two hours now and can't figure it out. I just want to center my entire page, using divs, with css. I also want it to work in most browsers. I've found sites that show you how it's done, but there's no explanation and it's too complicated to just copy it. I've also found sites that show it, but when I try it it just doesn't work. here's my css if that helps: I've been trying to get it to work so there might be some strange things in it. body { background-color: #F5FFF5; color: #000000; text-align: center; } TD { FONT-FAMILY: Verdana, Arial; FONT-SIZE: 9pt; color: #000000; } A { COLOR: #0000FF; TEXT-DECORATION: none; } A:hover { COLOR: #6969FF; TEXT-DECORATION: none; } .input { BACKGROUND-COLOR: #006600; COLOR: #CCFFCC; border-style: solid; border-color: #66FF00; FONT-FAMILY: Verdana, Arial; FONT-SIZE: 9pt; TEXT-DECORATION: none; } container { margin: 0 auto; text-align: left; } #banner { left: 25px; top: 10px; position: absolute; } #avatar { left: 15px; top: 100px; position: absolute; } #link { left: 25px; top: 375px; position: absolute; } #news { left: 200px; top: 100px; height: 171px; width: 370px; position: absolute; background-image: url("../images/testbg.png"); } #update { left: 588px; top: 100px; height: 171px; width: 100px; position: absolute; background-image: url("../images/testbg.png"); } #main { left: 200px; top: 365px; height: 50px; width: 100px; position: absolute; } Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/ Share on other sites More sharing options...
wildteen88 Posted April 26, 2009 Share Posted April 26, 2009 Your site wont center because you're using absolute positioning. Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819599 Share on other sites More sharing options...
Yeodan Posted April 26, 2009 Author Share Posted April 26, 2009 okay so how do I define where my divs should be placed without using absolute positioning? and I still don't know how to center my page Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819603 Share on other sites More sharing options...
jackpf Posted April 26, 2009 Share Posted April 26, 2009 Use relative/static positioning. And you can center stuff by using text-align: center; and margin: 0 auto; Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819605 Share on other sites More sharing options...
coalgames Posted April 26, 2009 Share Posted April 26, 2009 Im guessing you got this theme from online. If you want to be able to center it, you have to rewrite the whole thing. Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819885 Share on other sites More sharing options...
TheFilmGod Posted April 26, 2009 Share Posted April 26, 2009 Actually, you could center the page. I don't recommend using this technique. As absolute positioning is incorrect to center things! Enclose all your contents within a div called - "html-center" <body> <div id="html-center"> .......... all your body contents </div> </body> In your css: #html-center { width: (-specify width-)px; /* like - width: 800px; */ margin: 0 auto; position: relative; } There you go! It'll center; Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819906 Share on other sites More sharing options...
popcornplya Posted April 27, 2009 Share Posted April 27, 2009 Actually, you could center the page. I don't recommend using this technique. As absolute positioning is incorrect to center things! Enclose all your contents within a div called - "html-center" <body> <div id="html-center"> .......... all your body contents </div> </body> In your css: #html-center { width: (-specify width-)px; /* like - width: 800px; */ margin: 0 auto; position: relative; } There you go! It'll center; That will only center it for Firefox, Opera, etc. but not IE to center in IE just add text-align:center; to body then in the #html-center reset it with text-align:left; Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-819953 Share on other sites More sharing options...
wildteen88 Posted April 27, 2009 Share Posted April 27, 2009 Actually, you could center the page. I don't recommend using this technique. As absolute positioning is incorrect to center things! Enclose all your contents within a div called - "html-center" <body> <div id="html-center"> .......... all your body contents </div> </body> In your css: #html-center { width: (-specify width-)px; /* like - width: 800px; */ margin: 0 auto; position: relative; } There you go! It'll center; That will only center it for Firefox, Opera, etc. but not IE to center in IE just add text-align:center; to body then in the #html-center reset it with text-align:left; You are wrong. It will work fine in IE if you set a valid DOCTYPE. Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-820345 Share on other sites More sharing options...
TheFilmGod Posted April 27, 2009 Share Posted April 27, 2009 Actually you both are right. IE5 and lower will not center "margin: 0 auto;" unless you use a "text-align: center;" IE6+ will center margin: 0 auto; if you set a valid doctype. Link to comment https://forums.phpfreaks.com/topic/155711-centering-a-full-page/#findComment-820490 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.