Hey, can anyone please tell me how I get all of the content in this page to center? I had it right, but I used HTML tidy, and an XHTML converter. Now I have all the XHTML code validated but I can't figure out how to center it (i was using <center> before). I am using external CSS for the layout Thanks ahead!!
With your wrapper div, modify it with these css lines div#[name of wrapper] { margin-left: auto; margin-right: auto; } and that should work.
Ok, let's just assume I know nothing about html... here is my external CSS: body { margin : 0 auto; padding : 0 0 0 0; background : #000000 url(images/blogtapbg.gif) repeat-y top center; } p { margin-left : 80px; margin-right : 80px; font-family : verdana; font-size : 80%; } h1 { font-family : verdana; font-size : 140%; } h2 { margin-left : 80px; margin-right : 80px; font-family : verdana; font-size : 120%; } li { font-family : verdana; font-size : 80%; } .container { width : 750px; height : 100%; } .head { width : 785px; height : 65px; background : url(./images/head.gif); background-repeat : no-repeat; overflow : auto; } .content { width : 785px; background : url(./images/mid.gif); background-repeat : repeat-y; overflow : auto; } .foot { width : 785px; height : 50px; background : url(./images/footer.gif); background-repeat : no-repeat; } .text { padding-top : 30px; padding-right : 60px; padding-bottom : 20px; padding-left : 60px; } .title { font-size : 20px; text-align : center; } div.c6 { text-align : center; } span.c5 { font-size : 10px; } div.c4 { text-align : left; } tr.c3 { vertical-align : top; } td.c2 { width : 50%; } span.c1 { font-family : verdana; font-size : 80%; } HTML: What exactly do i do? lol
Well I recommend, for browswer compatibility, add margin: 0 auto; text-align: left; Code (markup): under the .container section and then add text-align: center; Code (markup): under the body section.. Let us know how you make out..would help if you put a link to the page (if you are able) Edit: Wow I'm awake, you did paste a link, sorry about that
Well I have noticed you have a ton of code and stuff not even inside the container..this could be part of the problem. The container should be the div containing everything else...this is why it isn't centering for you...the code is a mess also... I PM'd you, would be glad to help further.
Yep, at first I didn't look at the code of the site so just assumed things were in order..but once I looked at the actual site code Tables and divs and all sorts of stuff all mixed up... really a mess..!
Really? It's XHTML 1.0 valid with 0 errors and 0 warnings...how could it possibly be messed up. Mind Im talking about this page: http://www.blogtap.net/home999.htm (which is not centered) not http://www.blogtap.net
Just as a test change the container width from 750px to 80% and see what happens..assuming the other changes above were in there?
Alright this should work, and I have tried to dumb it down a shade. First, directly after the <body> tag in your HTML, add this <div id="wrap"> Code (markup): Then, directly before the closing </body> tag, add this: </div> Code (markup): Now you said it passed validation so I am assuming all your other <div> tags are closed. (99% isn't a problem if it passed validation)
hmmm...nope it still didn't change anything. I will tell you that I undid any of the previous changes (suggested earlier), do i need to make those changes first? thanks EDIT: dang i wish i didn't always cut corners, and get by using templates and trial and error methods instead of actually learning CSS! I really appreciate it that other people who have no benefit from doing so, take the time to look into other people's problems..it really says alot about the community here and the human spirit.
Tried it, it's still left aligned. By the way, I am doing this all on local...not uploading to server yet (that's why you wont see the changes in the home999 link
I've also just tried putting <div align="center"> after <body> and closing it with a </div> right before </body>..didn't work ahhhhhhhh!!!! lol this is starting to get annoying you know what's odd though, it does center in IE before i made any of the changes suggested! just not in FF..
csscott I'm going to be honest with you everything they tell you won't work. It's not because they are wrong no totally not. Its because your code is a complete mess. it may be valid but I really should push you to begin to use divs in place of tables. It will make your code more readable and it will fix your centering issues
Go figure, I spend hundreds of hours creating my own unique layout and it's a complete mess lol. I am willing to pay $20 to someone if they can convert everything to DIVs, clean up and messy code and fix the centering issue. I also needs to be XHTML valid (which it is right now)...send me a PM
Those were the words I was thinking..the code is valid but it's just in a mess, tables and just crap everywhere, bad spacing, hard to read =) Someone can probably convert it pretty easily though..I would help out if I wasn't at work right now. Im sure you'll get it worked out!