Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) Hello again, I am converting my table to css. Actually, converting the html table with deprecated tags to css tags! I placed the table in a div called contacttable my question is about text-align: center; Not only did it align my whole table centered (which i want), it aligned all my text in the table centered (which i want). My question is, I dont have to align center my td's in the table? It's enough to just text-align center the whole div to CENTER everything? What if i wanted to only align the table centered, but the text to the left? Would i use a class tag in the td's to align it left? www.webdrycleaners.com thanks Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
jlhaslip Posted April 26, 2009 Report Share Posted April 26, 2009 text-align is inherited by the elements below it (child elements). To change the behaviour, you need to modify the text-align on the child elements. Quote Link to comment Share on other sites More sharing options...
jlhaslip Posted April 26, 2009 Report Share Posted April 26, 2009 By the way, that link has a whack of errors and warnings, most of them from using an html Doctype with xhtml coding. Example, the self-closing tags have '/' at the end which html does not require. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.webdrycleaners.com%2F&charset=(detect+automatically)&doctype=Inline&ss=1&group=0&user-agent=W3C_Validator%2F1.654 Might want to work on that. Your new pages should be using a strict doctype, and html is suggested since you do not serve any xhtml/xml code Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) What if i wanted to only align the table centered, but the text to the left? Would i use a class tag in the td's to align it left? #contacttable is the container for the whole table so as Jlhaslip says, it affects everything. If you just want the table centered but not the text you don't use text-align: center, you should use a width and margin: auto (see note below) . At the moment you have margin: auto but no width (but you don't need a width or margin: auto if the div fits exactly inside another div which it does because #main is 510px wide and the table inside #contacttable is 510px wide):- #contacttable { /*text-align: center;*/ line-height: 18px; font-family: trebuchet ms; /*margin: auto;*/ } Now all the inner divs and td tags are aligned left. If you want the #contacttable div to center inside a container add margin: auto; width; ?px; to the div style; if you want the table to center inside #contacttable add style="margin: auto" to the table because it already has a width, but none of the above is needed in your case because the #main div is the correct width for all of them. Edited April 26, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) thanks for the reply, but i am more confused than ever. So is my contacttable showing up on the left alignment or centered? On IE 6 and FF 3.0 its all centered, even the text inside the table (which is what i want). I wasnt sure if my code for contacttable was correct. Also, i still have some OLD code in the form table on that page and wasnt sure of the doctype i should use. But all other pages have no deprecated tags so should i use the strict doctype, /p> "http://www.w3.org/TR/html4/strict.dtd"> /p> "http://www.w3.org/TR/html4/loose.dtd"> ( i have this now) or use --------------------------------------------------------------------------------------- /p> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> /p> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> thanks again.... It's a learning process for me... Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 I changed my faqs.html page and it validated and passed! but still not sure which doctype i should use...Now i have /p> "http://www.w3.org/TR/html4/loose.dtd"> but you mentioned i should use strict? thanks for any help.... Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) As you have it right now the text-align: center in the style for #contacttable centers the text inside it, but not the div itself. Previously I thought you wanted the table centered but the text left. However, as I said before, the div #contacttable doesn't need centering as the table inside it is 510px wide and the containing div#main is also 510px wide, so it all fits. If it didn't fit, an element like a div needs a width and margin: auto. You have margin: auto; in #contacttable but it's not doing anything as it's not needed. Inside the 510px wide table you have td tags of various widths like 160px, 165px and 175px so it looks OK and you can adjust these if you want. Regarding doctypes, on this board we prefer HTML 4.01 Strict (or transitional if you are using some deprecated [old ] tags) which means that some tags only need closing with > whereas in XHTML they need closing with /> Edited April 26, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) ok, thanks on the doctype....it did validate...(faqs.html) Now i am changing the page that we are discussing.. end tag for element "P" which is not open and i have one error...but i noticed that i had a start and it closed with a ...so im not sure why its still an error...cuz it's not open... Line 74 starts and line 148 ends Also, it was giving me an error for table height? so now i just left out the height of the table and just used width...grrr Also, on my faqs.html i dont have any deprecated old tags so should i use the strict instead of the transitional? or it doesnt matter? thanks again....i know i ask alot of questions. Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 26, 2009 Report Share Posted April 26, 2009 I don't think you do have a p tag open. The error is in line 148 but the top of the form has where there is no opening p tag after Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 oh, ok... I thought on line 74 where it starts the it would use the line 148's Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 26, 2009 Report Share Posted April 26, 2009 Ah!! So that opening tag is on it's own, but you can't have p tags inside p tags so you need to sort that out. Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) ok, now i moved it start p tag on line 74 and end p tag on line 114....and still no good! that's strange cuz on my faqs.html I started a p on line 60 and ended it on line 114 and everything is fine and passed... Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) If you have an opening p tag on line 74 and a closing tag on line 148, the p tags in the middle need to go or be isolated like this:- Leav the line 74 and 148 tags. Edited April 26, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 I guess thats where im confused. I dont have any p tags in between my opening p on line 74 and my closing p on line 114 Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 26, 2009 Report Share Posted April 26, 2009 and the form doesn't close until just before your Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 well because i still have the center tag i used transitional doctype. I still dont understand why my opening p tag isnt closed by my p tag that is below it...but i guess i'll have to figure that out....Right now thats the only error in validation for me on that page. Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 What about if i happen to use in a table to align td's valign="center" or align="left" are those deprecated too? or is it just the generic tag? Quote Link to comment Share on other sites More sharing options...
jlhaslip Posted April 26, 2009 Report Share Posted April 26, 2009 No, the use of align and valign is allowed for table cells in html4 documents, which is acceptable coding standard if you are not serving xml. A strict doctype is prefered. http://www.w3.org/TR/html4/struct/tables.html#h-11.3.2 Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 26, 2009 Report Share Posted April 26, 2009 Transitional doctype lets you get away with errors - so by lowering the standards, you get by. The point we're trying to make here is to use good code - period. And about the p tag - p is a tag that defines a paragraph, so putting stuff in it like divisions is just fundamentally wrong - the only thing ok inside a p tag are formatting tags - but div tags DO NOT belong inside a p tag. Boca's Premier Dry Cleaners 7050 W Palmetto Pk Rd Boca Raton, Fl 33433 (561) 394-9933 Click for map Store Hours M-F: 7am - 7pm Sat: 8am - 6pm Boca's Premier Dry Cleaners 21073 Powerline Rd Boca Raton, Fl 33433 (561) 487-7336 Click for map Store Hours M-F: 7am - 7pm Sat: 8am - 6pm Personal Touch Dry Cleaners 1320 Coral Ridge Dr Crl Springs, Fl 33071 (954) 753-6890 Click for map Store Hours M-F: 7am - 7pm Sat: 8am - 6pm And no - table align left isn't deprecated - but tables are as a tool for layout (sort of - or they should be) Quote Link to comment Share on other sites More sharing options...
lm Posted April 26, 2009 Report Share Posted April 26, 2009 try to use (X)HTML reference while coding or validating. Especially helpful when tables/forms are on a page. Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) Well, i think the only page i have deprecated tags are on the index.html page which is my contact us page for right now...The other pages i will change the doctype... thanks... I will also take away that p tag as i may not need it there and it wont change my look of the page.... Oh, one more thing....so the doctype i should use is /p> "http://www.w3.org/TR/html4/strict.dtd"> i changed my faqs.html to the strict and now i have 5 errors it says i cant use border in img's i cant use align in img's i cant use hspace in img's this is all giving me a headache...lol although i am changing and learning as i go.... I do have several spacer.gifs with border="0", i guess i need to put a style border="0px";? Ok, fixing it little by little... In my external styles sheet i just put img { border: 0px; } that saved me alot of trouble instead of going thru all my images and adding an inline style.. THANK YOU EVERYONE...I DID IT! MY PAGE IS VALIDATED IN STRICT DOCTYPE and i made the changes and learned something along the way. Now i just hope with all the changes it looks like it supposed to in IE 7...I checked it on IE6 and FF 3.0 and its fine... thanks again everyone. Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 26, 2009 Report Share Posted April 26, 2009 Yes - unless you're running XML, use HTML - and strict is for clean code. Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 26, 2009 Report Share Posted April 26, 2009 (edited) can someone check it on IE7 for me it should look as it does in FF 3.0 thanks everyone.... One more related question...I'm going do change the other pages one by one to the strict doctype and every now and then i need to do an inline style for hspace...There is discrepancy online for the correct coding... ex style="margin: 0px; 10px; 10px; 20px;" Is this correct with the ( and (")? Also, is the order top, right, bottom and left? Edited April 26, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 26, 2009 Report Share Posted April 26, 2009 hspace is yet anohter deprecated element - use margins instead. But yes - the order for any of these dimensions is always top- right - bottom - left. or top right/left bottom top/bottom right/left Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 27, 2009 Report Share Posted April 27, 2009 (edited) right i meant to say i will use margin. I thought that was evident in my example above where i used margin... ...and thanks Edited April 27, 2009 by Cashster09 Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 27, 2009 Report Share Posted April 27, 2009 I must have misunderstood and every now and then i need to do an inline style for hspace...There is discrepancy online for the correct coding... Quote Link to comment Share on other sites More sharing options...
Guest Cashster09 Posted April 27, 2009 Report Share Posted April 27, 2009 One more related question...I'm going do change the other pages one by one to the strict doctype and every now and then i need to do an inline style for hspace...There is discrepancy online for the correct coding... I mentioned hspace but wrote the code for margin ex style="margin: 0px; 10px; 10px; 20px;" that's ok, it happens to the best of us.... Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 27, 2009 Report Share Posted April 27, 2009 This is wrong:- style="margin: 0px; 10px; 10px; 20px;" No spaces except at the end style="margin: 0px 10px 10px 20px;" Quote Link to comment Share on other sites More sharing options...
Andrea Posted April 27, 2009 Report Share Posted April 27, 2009 ...by 'spaces' he means semi-colons Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 27, 2009 Report Share Posted April 27, 2009 ...by 'spaces' he means semi-colons Too early in the morning for me here in UK Quote Link to comment 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.
Note: Your post will require moderator approval before it will be visible.