Saturday, January 13, 2007

Testing method of avoiding large white space created by standard way of coding table

I have a post detailing how to write the HTML for a table in this post How to avoid large space above table when writing the HTML for a table in Blogger. There were two methods, the one I used is cumbersome. MLA commented in that post and asked for my opinion of his way of avoiding large white space above tables when writing HTML for tables in the standard format. I said I will test it, so I am testing it first in a New Blogger blog. If it works here, I believe it should also work in the old (classic) Blogger. So here goes. If you don't see any large white space between this paragraph, and the table, that means MLA's method works:















ProductCodePrice
Apple0123$1.25
Orange0247$1.55
Pear1928$1.45



Well, there are no large space between the paragraph above and the table as you can see, so MLA's method works.

This is how MLA did it. He created a class "nobr" using CSS, like this:
<style type="text/css">.nobr br { display: none }</style>
Then below the CSS, he created a division <div> specifying the class. He will then type the HTML for the table in the standard format within that division. For example, this is the script I used to create the above table:

<style type="text/css">.nobr br { display: none }</style>
<div class="nobr">
<table border="1">
<tr>
<td>Product</td><td>Code</td><td>Price</td>
</tr>
<tr>
<td>Apple</td><td>0123</td><td>$1.25</td>
</tr>
<tr>
<td>Orange</td><td>0247</td><td>$1.55</td>
</tr>
<tr>
<td>Pear</td><td>1928</td><td>$1.45</td>
</tr>
</table>
</div>


If you understand the method, well and good. If not, you can also see MLA's post: Table formatting in Blogger

No comments: