Faux Table > Td padding problem - Webmaster Forum - Web Design, Programming and SEO forums

09-13-2011, 05:57 AM

pxs

Status: Junior Member
Join date: Jan 2006
Location:
Expertise:
Software:

Posts: 54

iTrader: 0 / 0%

pxs is on a distinguished road

Faux Table > Td padding problem

Im getting a padding-top effect (padding set to 0) for a TD element when viewed in firefox but not when in IE ??

Is this a bug in firefox ??

HTML Code:

<table width="600" border="0" cellspacing="0" cellpadding="0"  style="border: 1px solid #ccc; border-top: none; border-bottom: none;">
          <tr>
            <td width="389" align="left" valign="top" style="padding-left: 10px; padding-right: 10px;font-family:Arial; font-size: 12px;"><p>Dear Mr spaz</p>
              <h2 style="font-size: 31px; color: #003399;">Thank you for your application</h2>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sagittis arcu id felis facilisis id aliquet nunc molestie. </p>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sagittis arcu id felis facilisis id aliquet nunc molestie.  </p>
              <h3 style="font-size: 12px; color: #003399;">Donec sagittis arcu id felis facilisis</h3>
           
           </td>
            <td valign="top" ><a href="#"><img src="images/image.jpg" width="210" height="407" alt="image" /></a></td>
          </tr>
        </table>

$0.06

09-13-2011, 06:23 AM

Hqtitan

Status: I'm new around here
Join date: Jul 2011
Location:
Expertise:
Software:

Posts: 6

iTrader: 0 / 0%

Hqtitan is on a distinguished road

Could be the <tr>, as well. Check the top margin, too.

09-13-2011, 07:52 AM

.Nick

Status: Request a custom title
Join date: Feb 2005
Location:
Expertise:
Software:

Posts: 1,159

iTrader: 3 / 100%

.Nick is on a distinguished road

Without a CSS reset any number of browser-specific styles could be causing it. Here you suggest the issue is with Firefox but on Stack Overflow you say the issue is in IE6.

In Chromium the spacing is the result of built-in styles for paragraph tags:
http://i54.tinypic.com/2eb7amb.png

09-13-2011, 12:02 PM

georgi

Status: I'm new around here
Join date: Aug 2011
Location:
Expertise:
Software:

Posts: 9

iTrader: 0 / 0%

georgi is on a distinguished road

I strongly recommend you to take a time and to replace every table tags in your code with div tag and css. Those way you will avoid such problems and also div tag is better accepted by google.

best regards,
Georgi

09-13-2011, 07:50 PM

Village Genius

Status: Geek
Join date: Apr 2006
Location: Denver, CO
Expertise: Software
Software: Chrome, Notepad++

Posts: 6,894

iTrader: 18 / 100%

Village Genius will become famous soon enough

This isn't tabular data, don't use tables. Tables are not meant to be used for the structure of a page.

09-14-2011, 02:11 AM

ronaldroe

Status: I'm new around here
Join date: Aug 2011
Location: Oklahoma City
Expertise: Design, HTML/CSS
Software: Webmatrix, Photoshop

Posts: 9

iTrader: 0 / 0%

ronaldroe is on a distinguished road

I won't beat the "don't use tables" horse any more than it has been here (though it is entirely correct). Generally, the problem you run into with tables and spacing is that there's an extra row or other table element there occupying the space. If that isn't the case, it's generally a margin or padding setting on some element within the table pushing things around.

$0.06