Frame shows spaces between the table cells.

[Cal Who]

I want to making a frame so I made a table:

..
<table>

<tr><td id="TL"></td><td id="T"></td><td id="TR"></td></tr>

<tr><td id="L"></td><td id="C"></td><td id="R"></td></tr>

<tr><td id="BL"></td><td id="B"></td><td id="BR"></td></tr>





</table>

and in my .css added things like that shown below.

Works OK except that the cells do not touch. There is a little space between
the images like there is a margin or padding.

Got any ides how to fix that?


Thanks
#BR

{

background:url("../MapBorderImages/BR.jpg") no-repeat scroll left top
transparent;

width:28px;

height:28px;

padding :0 ;

margin :0 ;


}

?

#B

{

background:url("../MapBorderImages/B.jpg") repeat scroll left top
transparent;

width:100px;

height:28px;

padding :0 ;

margin :0 ;


}

 

[Guest]

I want to making a frame so I made a table:

.
<table>

<tr><td id="TL"></td><td id="T"></td><td id="TR"></td></tr>

<tr><td id="L"></td><td id="C"></td><td id="R"></td></tr>

<tr><td id="BL"></td><td id="B"></td><td id="BR"></td></tr>

</table>

and in my .css added things like that shown below.

Works OK except that the cells do not touch. There is a little space between
the images like there is a margin or padding.

Got any ides how to fix that?

Thanks
#BR

{

background:url("../MapBorderImages/BR.jpg") no-repeat scroll left top
transparent;

width:28px;

height:28px;

padding :0 ;

margin :0 ;

}

?

#B

{

background:url("../MapBorderImages/B.jpg") repeat scroll left top
transparent;

width:100px;

height:28px;

padding :0 ;

margin :0 ;



}

<table cellpadding="0" cellspacing="0" border="0">

 

[Cal Who]

I want to making a frame so I made a table:

.
<table>

<tr><td id="TL"></td><td id="T"></td><td id="TR"></td></tr>

<tr><td id="L"></td><td id="C"></td><td id="R"></td></tr>

<tr><td id="BL"></td><td id="B"></td><td id="BR"></td></tr>

</table>

and in my .css added things like that shown below.

Works OK except that the cells do not touch. There is a little space
between
the images like there is a margin or padding.

Got any ides how to fix that?

Thanks
#BR

{

background:url("../MapBorderImages/BR.jpg") no-repeat scroll left top
transparent;

width:28px;

height:28px;

padding :0 ;

margin :0 ;

}

?

#B

{

background:url("../MapBorderImages/B.jpg") repeat scroll left top
transparent;

width:100px;

height:28px;

padding :0 ;

margin :0 ;



}

<table cellpadding="0" cellspacing="0" border="0">


That did it. I tried putting it into my .css file but I was told they were
unknown property names. Comment??

But it works great in the markup.

Thanks

 

[Guest]

<table cellpadding="0" cellspacing="0" border="0">

That did it. I tried putting it into my .css file but I was told they were
unknown property names. Comment??

But it works great in the markup.

Thanks

Well, there isn't actually a CSS properties for cellpadding or
cellspacing, but there is the CSS padding property which allows you to
achieve the same effect.

table {
border-collapse: collapse;
}
table td,
table th {
padding: 0;
}

but this may not work in the same way in all browsers and I would
recommend to use the cellspacing/cellpadding attributes.

 

[Cal Who]

<table cellpadding="0" cellspacing="0" border="0">

That did it. I tried putting it into my .css file but I was told they were
unknown property names. Comment??

But it works great in the markup.

Thanks

Well, there isn't actually a CSS properties for cellpadding or
cellspacing, but there is the CSS padding property which allows you to
achieve the same effect.

table {
border-collapse: collapse;
}
table td,
table th {
padding: 0;
}

but this may not work in the same way in all browsers and I would
recommend to use the cellspacing/cellpadding attributes.


Thanks a lot