Table problem in google chrome

[Cadish]

Hi guys,

I'm struggling with this issue:

When I create a very simple table, there are some spaces between the borders (see screenshot). This is only the case in Google Chrome. In IE, Firefox, ... etc., all seems fine...

Anyone knows how to solve this?

My simple html test-file looks like:

Code Select Expand

<style>
td {
border-left: double #CECECE 3px;
height: 16px;
width: 100px;
}
</style>

<table cellpadding="0" cellspacing="0">
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
</table>

Thanks!!
Cadish

[Spaceman-Spiff]

Add the css "empty-cells: hide;"

Reference: http://www.w3schools.com/css/pr_tab_empty-cells.asp

[B]

That style only has one border definition (left) for a table cell. If you're talking about the existence of two lines, it's because you are using double.

Code ("CSS") Select Expand


border-left: double #CECECE 3px;


Change it to

Code ("CSS") Select Expand


border-left: solid #CECECE 3px;


to get one line. Or remove that code entirely if you don't want a border to show at all.

B

[Cadish]

Thanks guys, but I want to show a double line, but without the "gaps" between the cells...

[Spaceman-Spiff]

Not sure why the gap is there in webkit-based browsers. It seems to show up only if you use 3px or wider border width.

Another trick is using a background image for the <td> and position it to the left.

[B]

Ohhhh....I think I understand, now. You're talking about the spaces above and below each cell that's causing the borders not to connect. Usually, you can fix that by adding the following style to the table.

Code ("table style") Select Expand


border-collapse: collapse;


However, that doesn't seem to be fixing it in Chrome, as long as double is the border style. Switching to solid, along with the above style addition, removes the gaps.

B

[Cadish]

Thanks guys... So it seems to be a problem related to Chrome...

I'll use the solid-style then instead of the double until this is fixed.

[Rakhi]

Hi guys,
I have problem with table width;
i take table in hxxp:div.like [nonactive],
<div style="width:550px">
<table width="100%" >
<tr> did my work here </tr>
</table>
</div>
my problem is table width is greater than its parent width. Please reply me how can i set its width. It working fine in all browsers except Google Chrome.