WordPress.com Forums » Topic: How to remove the space between table cells? http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells WordPress.com Forums » Topic: How to remove the space between table cells? en Wed, 19 Jun 2013 18:53:33 +0000 http://bbpress.org/?v=1.1-alpha-2539 1tess on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084745 Mon, 03 Dec 2012 18:29:15 +0000 1tess 1084745@http://en.forums.wordpress.com/ @justpi
It was only a suggestion. At any rate Lanceolot came up with a nice alternative.

]]> justpi on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084719 Mon, 03 Dec 2012 18:11:00 +0000 justpi 1084719@http://en.forums.wordpress.com/ @Lanceolot:
You're welcome.
"did not know anything about the 97.5 % max image size (where is that documented?)"
I thought I answered that when I wrote "the CSS of the theme specifies" etc: you can find it if you examine the stylesheet of the theme, or if you examine your page using a utility such as Firebug (in Firefox). That's what you should do in general to find what you need and what you don't need to override instead of trying all the commands you can think of.

@Tess:
"why not make a composite image and then use image mapping"?
That's exactly why I asked my question! (But I would suggest it only if Lanceolot wanted to break one actual image into pieces.)

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084663 Mon, 03 Dec 2012 17:23:43 +0000 lanceolot 1084663@http://en.forums.wordpress.com/ True. I had not thought of that.. but to be honest, I think that any change of theme is likely to mess up more than just a few tables. I decided to use divs for this (more flexible - i can replicate the Gallery Rectangle style easily and I am not really displaying tabular data more suited to tables) and I have done a few live previews with other themes and it seems to work or degrade gracefully. It works on android and safari (iOS) too so I can live with that.

]]> 1tess on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084654 Mon, 03 Dec 2012 17:17:06 +0000 1tess 1084654@http://en.forums.wordpress.com/ You are right about the difficulty of changing a thumbnail. But you might find you want to switch themes and your tables could be messed up by other quirky table CSS coding…

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084650 Mon, 03 Dec 2012 17:13:46 +0000 lanceolot 1084650@http://en.forums.wordpress.com/ I have not used an Image Map for anything in almost a decade.. but yes, that would also work - not ideal if I needed to change something but it would serve the same end result.

]]> 1tess on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084645 Mon, 03 Dec 2012 17:09:15 +0000 1tess 1084645@http://en.forums.wordpress.com/ Just another idea: why not make a composite image and then use image mapping to make the "thumbnails" clickable?

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084636 Mon, 03 Dec 2012 17:02:13 +0000 lanceolot 1084636@http://en.forums.wordpress.com/ Just a note before the thread is closed - I have removed the test page.

Key items for anyone else having this issue:

Beyond the normal margin etc CSS tags, the following also affect the 2011 theme and image spacing.
line-height on the div or tr
max-width on the img tag

Thanks again justpi.

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084595 Mon, 03 Dec 2012 16:36:09 +0000 lanceolot 1084595@http://en.forums.wordpress.com/ Brilliant... Thank you for this.

I did not know that this was a theme specific issue and did not know anything about the 97.5 % max image size (where is that documented?) - but now that you mention it, I did experience an issue where I thought I was going blind because the odd image looked a little blurry - now I realise its due to the scaling.

Yes. I have added unnecessary code - it was all in an attempt to try and resolve the issue - i.e. try anything till it works. I can now rip it all out and create something that may just pass muster.

What do I need it for? Well, I want to create borderless galleries for images that link to artists work. I cannot use the Gallery feature because it does not allow for external URL linking directly off the image. I need to do this because I don't want to have to duplicate the a large version of any artists work on the WordPress.com servers - its not mine so while an icon and link would be fine, just copying their work onto my blog is not something I am comfortable with.

You can see what I am doing on an existing page (which will shortly be updated with the new code)...

http://lanceolot.wordpress.com/2012/11/29/inspire-realistic-portraits/

Thanks for your help.

Lanceolot

]]> justpi on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084560 Mon, 03 Dec 2012 15:46:10 +0000 justpi 1084560@http://en.forums.wordpress.com/ It's not wordpress.com in general, it's the quirks of some themes. You've added lots of unnecessary stuff to your code but you're missing one crucial quirk: each image on your page isn't 160px wide, it's 156px (plus 4px of space inside the 160px wide cell), because the CSS of the theme specifies a 97.5% max width for inserted images. So you need to turn these:
<img ETC ETC
to
<img style="max-width:100%;" ETC ETC

But why do you need a grid with no space at all between the cells?

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084510 Mon, 03 Dec 2012 14:20:39 +0000 lanceolot 1084510@http://en.forums.wordpress.com/ Another update - I created a 3x3 grid using DIV and pure CSS... the SAME problem happens.... there is a space between the columns.

very frustrating.... especially considering everything works perfectly in a normal HTML (i.e. not hosted on WordPress.com) page...

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084500 Mon, 03 Dec 2012 13:43:06 +0000 lanceolot 1084500@http://en.forums.wordpress.com/ Additional info - I found that the line-height property on the TR has removed the horizontal gaps between rows... This is a step in the right direction, now I need to figure out how to remove the gap between the columns.

Anyone got any suggestions?

]]> lanceolot on "How to remove the space between table cells?" http://en.forums.wordpress.com/topic/how-to-remove-the-space-between-table-cells#post-1084493 Mon, 03 Dec 2012 13:24:32 +0000 lanceolot 1084493@http://en.forums.wordpress.com/ Hi,

I am trying to create a 3x3 table grid with an image in each cell. In a normal HTML page, there is no space between each cell in the table I have created but the same code inserted into a wordpress.com page or post, is displayed with spaces between the cell.

See http://lanceolot.wordpress.com/testtable/ for an example.

I want the same grid - just without the space between the cells. I have used every HTML tag I can think of (including deprecated ones) and inline CSS but nothing seems to work. The HTML I am using works perfectly in a normal HTML page - but the moment its loaded in a wordpress.com page, the problem is visible.

Anyone able to help?

Thanks

Lance

]]>