hey folks,
i had been working on a project for last 6 months and now its getting its final touches. i wanted to make code optimized. i remember i used design view in DW for much initial coding but later i have to stick to code view. meanwhile i was in code view. there were many things like if i am putting some data in table column. the td gave the text tag of span and some of p. e.g
that ofcourse is some random dummy example. question is which one to use span or p? whereas span in inline element and p is a block level element. so i guess i should use span tag. right? more over. i have some tags to give some words some gap from text area. so should i be creating some class. coz its just in one or two pages.
lastly. i have table attributes like cellpadding, cellspacing, border set to 0 is all pages. havin those attributes seems naive,how can group table property into one class.
please share more advice optimizing my code.
Thanks in advance
Well, theoretically you shouldn’t need a paragraph in most tables anyway. Is the data tabular or are you misusing the table to layout the page contents? For the targeted table you’d have something like: table.txt td { padding : 80px; } on the TABLE e.g. <table class=“txt”> and so forth.
The table.txt is an example of putting a class on the table tag itself (not a td) in order to be special with that table.
table.txt td {styles;} would then hit ALL td’s of a table with the class of “txt”.
But yeah, if you only had some td’s who need spacing, you could give them a class instead. If more than half of your td’s need it though, that might be too much HTML.
<td class=“roomy”>this text gets some side padding</td>
td {
regular td styles;
}
td.roomy {
padding: 0 5px; (gets some padding on the sides… remember padding counts towards the whole width)
}
As an example.
Just so you know, you don’t need to have stuff like cellpadding/cellspacing in the HTML. You can actually style tables entirely with CSS (unless someone knows I’m wrong about something… I certainly have never needed the HTML attributes).
we do have to define cellpadding,cellspacing and border = 0 coz many browsers renders it different. i.e they could say its value is 1. so have to. as i have that repeating again n again in my code. on every page. i wanna make a class of it in css and take it to there. so i can cut on html
I do not define cellpadding or cellspacing at all. However I do also allow my tables to have some small differences cross-browser, because of the type of element a table is (esp the way they accordion their widths).
You can absolutely remove border in all browsers with
table {
border: 0;
you can also add border-collapse: collapse; if you do want borders, but just one line of them… default is “separate” I think
if you want space between separated borders, you can specify border-spacing here as well
}
though I seem to recall that I needed to state a border to get one… I didn’t get borders by default (but it’s been so long since I’ve made a table without borders, i don’t remember).
Or, you can specify the borders themselves (colours etc) in the td’s th’s themselves
th, td {
border: 1px solid #whatever;
}
Maybe try without it first, and if it works well enough for you then you can indeed clean up your HTML a bit more because then you’ll know you don’t need it. If however you find CSS doesn’t do what you need while cellpadding/cellspacing does, then you leave it in.
*edit I should mention, my comment about not needing cellpadding/cellspacing is indeed assuming you DO have CSS for tables… otherwise, you will get whatever default the browser is. However, these browser defaults shouldn’t be able to override your CSS like the type I posted above!
Playing with code over time, you also learn how to optimise as you go. The code for my first several websites is really pretty bad… it works, and looks ok in browsers, but I have way more code in there than I need, and a few bad practices. But this is great, it means my current sites are improved.