SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict AfroNinja's Avatar
    Join Date
    Oct 2006
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Table rowspan issue

    Hi, I'm trying to make a table to display a set of 'comments left' by the users on my site. Since css has issues with setting heights/min heights between browsers I went with a table so the cells would fill out the way I want. It works fine, except that there is an extra couple px of padding on the top of the right column.

    I isolated the issue and you can see what I mean here:
    http://www.afro-ninja.com/tabletest.htm

    also, here is the xhtml+css code

    HTML Code:
    <table style="width: 500px; border: 1px solid black;">
    <tr>
    	<td style="width: 120px; border: 1px solid black;" rowspan="3">
    		<a href="">Name</a>
    		<br />
    		<a href=""><img src="" height="80" width="80" style="margin-top: 5px; border: 1px solid black;" /></a>
    		<br />
    		<small>Member since 3/3/3</small>
    		<br />
    		<br />
    	</td>
    </tr>
    <tr>
    	<td style="height: 25px; border: 1px solid black;">
    	post date
    	</td>
    </tr>
    <tr>
    	<td style="border: 1px solid black;">
    	text goes here
    	</td>
    </tr>
    </table>
    can anyone help me get rid of that extra space?
    The Flash Gaming Network
    Editorial reviews for the latest flash games!
    Afro Ninja Productions
    Original flash games and content from a guy with an afro

  2. #2
    SitePoint Guru
    Join Date
    Feb 2008
    Posts
    655
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You need to remove the first </tr><tr> bit.

    Your html defines 3 rows, whereas all you actually want is 2.

    So your html should look like this:
    Code HTML4Strict:
    <table style="width: 500px; border: 1px solid black;">
    <tr>
    	<td style="width: 120px; border: 1px solid black;" rowspan="3">
    		<a href="">Name</a>
    		<br />
    		<a href=""><img src="" height="80" width="80" style="margin-top: 5px; border: 1px solid black;" /></a>
    		<br />
    		<small>Member since 3/3/3</small>
    		<br />
    		<br />
    	</td>
    	<td style="height: 25px; border: 1px solid black;">
    	post date
    	</td>
    </tr>
    <tr>
    	<td style="border: 1px solid black;">
    	text goes here
    	</td>
    </tr>
    </table>

  3. #3
    SitePoint Addict AfroNinja's Avatar
    Join Date
    Oct 2006
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you! that's exactly what I needed. The syntax is still a bit confusing for me but it makes sense enough.
    The Flash Gaming Network
    Editorial reviews for the latest flash games!
    Afro Ninja Productions
    Original flash games and content from a guy with an afro


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
  •