a bug in css??

by **peer2peer** on Sun Dec 26, 2004 10:04 pm

is this a bug in css?
please copy and run this code:

<html>
<style>
.currentHeaderTabNew { font: 12px arial,helvetica, sans-serif;
font-weight: bold;
letter-spacing: 1;
color: #FFFFFF;
border-width: 1px;
border-style: solid;
border-color: #888888 #888888 #3366CC #888888;
padding: 0.2em;
background-color: #3366CC; }
.headerTabNew { font: 12px arial,helvetica, sans-serif;
font-weight: normal;
color: #000000;
border-width: 1px;
border-style: solid;
border-color: #888888 #888888 #A8A8A8 #888888;
padding: 0.2em;
background-color: #EEEEEE;
text-align: center; }
.headerTabSpacer { width: 2px; background-color: #FFFFFF;
border-width: 0px 0px 1px 0px; border-style: solid; border-color:
#888888;}
</style>

<body>
<table cellspacing="0" cellpadding="0" border="0" align="center">
<tr bgcolor="#DDDDDD">
<td class="headerTabNew tabMainNew" width="51" nowrap><a href=""
class="tabtxt">1</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap><a href=""
class="tabtxt">2</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap><a href=""
class="tabtxt">3</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap ><a
href="" class="tabtxt">4</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap><a
href="" class="tabtxt">5</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap><a href=""
class="tabtxt">6</a></td>
<td class="headerTabSpacer"> </td>
<td class="headerTabNew tabMainNew" width="51" nowrap><a href=""
class="tabtxt">7</a></td>

</tr>

</table>

</body>
</html>

can someone tell me why the borders in the 1,6 td's are not shown?

it works only in explorer but in netscape or mozilla - no border in the right side.

please help

by **webmaster** on Mon Dec 27, 2004 1:21 am

Firefox and tables is not a good combination, but you can fix it if you remove all the width="51" settings in the <td>:s and set width="357" in the <table>

Then it will work in both IE and Mozilla, and your code will even load faster

Here is the code if you just want to copy:

Code: Select all: <table width="357" cellspacing="0" cellpadding="0" border="0" align="center"> <tr> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">1</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">2</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">3</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap ><a href="" class="tabtxt">4</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">5</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">6</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" nowrap><a href="" class="tabtxt">7</a></td> </tr> </table>

And welcome to DEVPPL

by **peer2peer** on Mon Dec 27, 2004 7:24 am

but the problem is i need to control the width of each TD
how can i do that??

thanks

by **ReFredzRate** on Mon Dec 27, 2004 10:04 am

You can try controlling the <TD>'s using percents. Instead of like <TD WIDTH="51"> you could use <TD WIDTH="30%">

by **webmaster** on Mon Dec 27, 2004 12:10 pm

peer2peer wrote:but the problem is i need to control the width of each TD
how can i do that??

thanks

Then use your original script, but set width="1%" in the <table> like this:

Code: Select all: <table width="1%" cellspacing="0" cellpadding="0" border="0" align="center"> <tr> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">1</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">2</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">3</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap ><a href="" class="tabtxt">4</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">5</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">6</a></td> <td class="headerTabSpacer"> </td> <td class="headerTabNew tabMainNew" width="51" nowrap><a href="" class="tabtxt">7</a></td> </tr> </table>

by **peer2peer** on Mon Dec 27, 2004 7:34 pm

by **webmaster** on Mon Dec 27, 2004 8:18 pm

That I don't know =)
But is it working for you now?

by **Phate** on Mon Dec 27, 2004 9:40 pm

I think that it has to do with the pixels, and firefox resizing the size of the workspace to like 98%

When it resizes, it loses some pixels

by **webmaster** on Mon Dec 27, 2004 9:53 pm

Phate wrote:I think that it has to do with the pixels, and firefox resizing the size of the workspace to like 98%

When it resizes, it loses some pixels

are you sure about that, Ive never heard about it, or seen any lost pixels on any other sites

by **Phate** on Tue Dec 28, 2004 3:30 am

actually... it just sounded good in my head... When i re-read it... it just sounded stupid. I thought that it might be the same as photoshop, for example, where if you resize the platform to like 50%, you lose some pixels. I apologize for my previous statement; I am retarted.

by **ReFredzRate** on Tue Dec 28, 2004 8:45 am

It's partially true though, Phate. When I build a table based website and use a background image for that, I can see that it loses at least 2 pixels in Firefox. So when I say I want the table to be 400px wide, it somehow changes to 398px.

a bug in css??

a bug in css??

thanks a lot

Re: thanks a lot

but whats the logic behind it??

Who is online