Table Padding

GK User
Thu Dec 02, 2010 12:41 pm
I have a table in an article and despite having cellpadding and cellspacing set to 0, there is still padding around every cell. Also it won't seem to accept cell,background colours.

Is there something in the template CSS that is cuasing this?

Thanks

paul
User avatar
Junior Boarder

teitbite
Sun Dec 05, 2010 3:32 am
Hi

Please show me Your site.
User avatar
Moderator

GK User
Mon Dec 06, 2010 8:37 am
Hi

site is http://www.armfieldangling.com

As you can see from the following page, the map of the lake is created using a table with no cellpadding or cellspacing yet there are large gaps between the cells.

http://www.armfieldangling.com/carp/dom ... biere.html

cheers

pj
User avatar
Junior Boarder

teitbite
Tue Dec 07, 2010 1:17 am
Hi

Please go to http://www.armfieldangling.com/template ... joomla.css

and remove the padding in classes:

Code: Select all
td {
    font-size: 100%;
    padding-bottom: 6px;
    padding-left: 6px;
    padding-right: 6px;
    padding-top: 6px;
}

.article-content img {
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
}
User avatar
Moderator

GK User
Tue Dec 07, 2010 12:24 pm
hi Teitbite

Thanks, that seems to have cured the problem in all browsers apart from IE. You can see from the screenshot below that each image still seems to be displying some padding (bottom).


screen8.jpg


Cheers

Pj
User avatar
Junior Boarder

teitbite
Wed Dec 08, 2010 8:30 pm
Hi

Try maby add "!important" at the end of every line with padding in css.
User avatar
Moderator

GK User
Thu Dec 09, 2010 1:23 pm
Hi

still haven't been able to solve this. Anything else I can try?

Thanks

PJ
User avatar
Junior Boarder

GK User
Fri Dec 10, 2010 9:45 am
Update on this issue.

Having tested this issue further, it seems that this image padding issue only shows up in IE8. I Googled this problem and others were experiencing this problem because the site was displaying the wrong DOCTYPE in the template.

I removed <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> from layouts.default.php and the padding on the images disappears.

Is there any reason why I should not remove this doctype description and just leave <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Cheers

Paul
User avatar
Junior Boarder

teitbite
Fri Dec 10, 2010 5:01 pm
Hi

To be honest I wouldn't have thought about it, but sure You can leave it like that :)
User avatar
Moderator

GK User
Tue Dec 14, 2010 1:53 pm
Hi Teitbite

actually I have discovered that removing this does cause some display issues so it's not ideal.

Bearing in mind that this change makes things display OK in IE8 (which is the only place where the padding issue was showing), can you think of any other way to resolve this problem?

Thanks

pj
User avatar
Junior Boarder

teitbite
Wed Dec 15, 2010 3:05 am
Hi

You can still use this solution but restricting it to one layer and use that layer around the map. For example:

Code: Select all
<div class="ok_map">
[table with map]
</div>


and for example css code like this:

Code: Select all
.ok_map * {
padding:0px !important;
margin:0px !important;
}
User avatar
Moderator

GK User
Wed Dec 15, 2010 4:04 pm
Hi Teibite

that didn;t work either.

I finally seem to have resolved the problme by removing any whitespace from above and below the images using:

display: block;
vertical align: middle;

Not sure if this is technically correct but seems to have worked.

Thanks for your help

pj
User avatar
Junior Boarder

teitbite
Wed Dec 15, 2010 5:00 pm
Hi

If it worked than why it can't be correct ? :)

I haven't seen spaces in table code ;/ My eyes are getting older and older.
User avatar
Moderator


cron