[Wylug-help] CSS for table and img - can't get rid of gaps

Christopher Birchall C.T.Birchall at leeds.ac.uk
Thu Nov 19 16:00:16 UTC 2009


Hi,

Something you may have already thought of, but could this be caused by default cellspacing/cellpadding values of html tables?

Setting padding values in css takes care of the default cellpadding value of the table (sets it to 0px) but cellspacing is not affected. You can try the border-spacing css attribute, but I don't know if that will work in IE.

You could test this theory by putting cellspacing="0" in the table tag, if you haven't already.
Cheers,

Chris

Chris Birchall 
IT and Web Officer 
UK Centre For Bioscience, The Higher Education Academy
9.15 Worsley Building
University of Leeds
www.bioscience.heacademy.ac.uk 


-----Original Message-----
From: wylug-help-bounces at wylug.org.uk [mailto:wylug-help-bounces at wylug.org.uk] On Behalf Of Gary Stainburn
Sent: 19 November 2009 15:41
To: wylug-help at wylug.org.uk
Subject: Re: [Wylug-help] CSS for table and img - can't get rid of gaps

Hi Simon,

tried that, but it made no difference.  I've also noticed that the 
vertical-align for the TD isn't working as the text is at the bottom of the 
cell.

The image is taken on Fedora/Firefox but looks the on WinXP/IE7

http://www1.ringways.co.uk/images/treeview_not_working.png

The images themselves are just 20x20 PNG files with the black lines going all 
the way to the edge.

Gary

On Thursday 19 November 2009 15:23:00 Simon Greenwood wrote:
> Give the images a vertical-align,either bottom or middle. I've got an
> example somewhere but I would need to find it.
>
> s/
>
> 2009/11/19 Gary Stainburn <gary.stainburn at ringways.co.uk>
>
> > Hi folks.
> >
> > I'm creating a tree-view using a table and three images. The logic is
> > working
> > fine for generating the html, but I cannot get the css right to eliminate
> > the
> > gaps between the images.  I don't know if it's the table or the images
> > that generate the gaps.
> >
> > Gary
> >
> > table.treeview {
> >        border-collapse: collapse;
> >        padding: 0px;
> >        margin: 0px;
> >        border: 0px;
> >        empty-cells: show;
> > }
> > .treeview tr {
> >        padding: 0px;
> >        margin: 0px;
> >        border: 0px;
> >        vertical-align: middle;
> > }
> >
> > .treeview td, .treeview th {
> >        padding: 0px;
> >        margin: 0px;
> >        border: 0px;
> >        vertical-align: middle;
> > }
> >
> > .teeview img {
> >        margin: 0px;
> >        border: 0px;
> >        padding: 0px;
> >        hspace: 0px;
> >        vspace: 0px;
> >        width: 20px;
> >        height: 20px;
> > }
> >
> >
> > --
> > Gary Stainburn
> >
> > Gary's Haircut 700
> > Please visit http://www.justgiving.com/Gary-Stainburn/ to help me
> > raise money for Cancer Research - in return I'll have my head shaved
> >
> >
> > _______________________________________________
> > Wylug-help mailing list
> > Wylug-help at wylug.org.uk
> > https://mailman.lug.org.uk/mailman/listinfo/wylug-help



-- 
Gary Stainburn

Gary's Haircut 700
Please visit http://www.justgiving.com/Gary-Stainburn/ to help me 
raise money for Cancer Research - in return I'll have my head shaved
 

_______________________________________________
Wylug-help mailing list
Wylug-help at wylug.org.uk
https://mailman.lug.org.uk/mailman/listinfo/wylug-help



More information about the Wylug-help mailing list