SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE Border-Collapse

    When I use IE and use a border-collapse with this code:

    HTML Code:
    <table cellspacing="0px" style="border-collapse:collapse;">
    
      <tr>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
      </tr>
    
      <tr>
       <td colspan="3" style="border:1px solid black;">Data 1</td>
       <td colspan="7">Data 2</td>
      </tr>
    
      <tr>
       <td colspan="1">Data 3</td>
       <td colspan="7" style="border:1px solid black;">Data 4</td>
       <td colspan="2">Data 5</td>
      </tr>
    
    </table>
    For some reason the, the element Data 4 is missing its border on the top where it doesn't touch Data 1. This appears to be a bug in IE because it works fine in Firefox. Does anybody have any ideas how to fix this problem without removing the border-collapse?
    Last edited by kepha; Jun 27, 2006 at 12:02.

  2. #2
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry, you're right. I changed the colspans. Try it again and you'll see the problem.

  3. #3
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No, it's still not working in IE.

  4. #4
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cool, it does work. Thanks.

  5. #5
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But now what should I do when I add a third row?

    HTML Code:
    <style type="text/css">
    	td{}
    	
    	* html .x{border-top:1px solid #ffffff;position:relative;}
    	* html .y{border-bottom:1px solid black;}
    	
    	*+html .x{border-top:1px solid #ffffff;position:relative;}
    	*+html .y{border-bottom:1px solid black;}
    </style>
    
    
    <table cellspacing="0" style="border-collapse:collapse;">
    
      <tr>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
       <td>&nbsp;</td>
      </tr>
    
      <tr>
       <td colspan="3" style="border:1px solid black;">Data 1</td>
       <td colspan="7" class="y">Data 2</td>
      </tr>
    
      <tr>
       <td colspan="1">Data 3</td>
       <td colspan="7" style="border:1px solid black;">Data 4</td>
       <td colspan="2" class="x">Data 5</td>
      </tr>
      
      <tr>
      	<td colspan="3">Data 6</td>
    	<td colspan="6" style="border: 1px solid black;">Data 7</td>
    	<td colspan="1">Data 8</td>
      </tr>
    
    </table>
    I'm now still getting the problem with Data 7.

  6. #6
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Bump.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •