line height

**houseofpaign** · 07-11-2006, 10:58 AM

When you go to my site (http://www.houseofpaign.com/) and look at the white space inbetween the most popular and most recent tables, the whitespace is different.

I have the tables seperated by a , but it is too big. is there a way to make the BR tag smaller?

i don't really want to put a clear spacer image. any ideas out there?

**LadynRed** · 07-11-2006, 03:49 PM

create a CSS rule for (your slash is backwards)

smallBr{
font-size: 1px;
line-height: 0; --- adjust as needed
}
Then in your HTML, use

**Jdinh04** · 07-11-2006, 04:05 PM

Instead of messing around with the CSS, ad adding that "BR" height when you don't need to. I just simply created 3 tables, 2 row and 2 columns. I merged the first colum with 2 rows into 1 column and the second one into 1 column and two rows. This will look much better and less work, all you have to do now is just add in the links and its styles into the tables.

Heres the code, it would be much better I hope.

Quote:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>House of Paign</title>
<style type="text/css">

</style>
</head>

<body>
<table width="801" height="583" border="0">
<tr>
<td width="352" rowspan="2" valign="top" bgcolor="#FEFBEB" style="padding: 5px">Categories 
 
Add links here ... </td>
<td width="439" valign="top" bgcolor="#FEFBEB" style="padding: 5px">Most Popular 
 
Add links here ... </td>
</tr>
<tr>
<td valign="top" bgcolor="#FEFBEB" style="padding: 5px">Most
Recent 
 
Add links here .... 
</td>
</tr>
</table>
</body>
</html>

Let me know if you need any other help.

**LadynRed** · 07-11-2006, 04:50 PM

Sorry, but the better method is CSS,it takes far less effort and far, far less maintenance. Dumping bad tables for layout would be the best of goals here !

**csingsaas** · 07-11-2006, 09:30 PM

Two ways you can accomplish this. One would be by implementing some basic style attributes in the table tag.

margin-bottom: 10px;
margin-left: 10px;
etc.

Or, nest each in of those three tables within a table that has three cells instead of just two (one cell for the left column, two cells for the right column). Each of the yellow boxes occupies it's own cell. Then you can simply adjust the cellpadding. Make sure you set the inner table to take up 100% of height and width.

**ChipJohns** · 07-12-2006, 12:50 AM

Tables are only good for eating dinner @;-)

**Jdinh04** · 07-12-2006, 08:07 AM

From what I known so far they have work best for me, so I stick with them. To be honest, I am not great of a coder, but when it comes down to business they do the job. Of course I wouldn't mind learning other ways and techniques, but thats just my opinion.

**LadynRed** · 07-12-2006, 10:01 AM

Quote:

Tables are only good for eating dinner @;-)

Amen ChipJohns !!!

They do the job, but they do it at a cost. Read this and understand WHY tables for layout is bad practice:
http://www.hotdesign.com/seybold/everything.html

**manthu64** · 07-13-2006, 06:19 AM

hello house of paign,

you can add one rows instead of tag.

like :

Quote:

it will work nicely. then also if u got the provlem then tell freely. Thanks.