Spacing between rows in Tablepress Firefox/Chrome

Hi,

thanks for your post, and sorry for the trouble.

This is basically caused by the structure of your table.
Each of your lines of text is in a separate table row, and in the left column, you have merged those rows for the cell with the image. Due to the height of that image, the five other rows have to increase in height, which results in that extra space.

I suggest to make this a table with only one row and two columns, where all the text is added into the same cell. That way, there would not be so much white space.

Regards,
Tobias

Hi Tobias,
That is a great solution, the only problem is that I would like to set different font weights for each line of text. Eg. first line bold, second (description of work) normal, third (crediting collaborators) in italic. etc. The only way I have gotten this to work in the past is by going into the plugin-options and instructing the text to be in different styles in different cells using CSS. If there is a way I can do this without multiple rows/cells please let me know!
Thanks again, Margot P.

Hi again,
I made changes in Row #1 and #4 so you can see what I am talking about.
Your help is always much appreciated!
Best, Margot P.

Hi Margot,

yes, you can achieve this without putting the text into separate cells. You will just have to use a little bit of HTML code around the text (this is also pretty easy if you use the “Advanced Editor” (there’s a button for this below the table input fields)).

For your example, you would simply use this cell content:

<strong>The California Academy of Sciences</strong>
Timeline Wall
Description
<em>In collaboration with Volume Inc.</em>
dots or numbers

Regards,
Tobias

Beautiful! Is it possible to adjust line spacing within the cell (short of hitting extra returns)? I’m really happy with this but I thought I’d ask.

Looks like you’ve made lots of handy upgrades since I used this last. Tablepress is the best thing since sliced bread!

Margot P.

forgot this part: adjusting font size. I’ll see if I can do that using advanced editor…thanks, Margot P.

Hi Margot,

adjusting the line spacing requires “Custom CSS” again, like

.tablepress-id-1 .column-2 {
  line-height: 20px;
}

That’s however more useful for the inter-line spacing. Position/moving line is still done best by hitting return.

For the font size, you’ll have to use some slightly more advanced HTML and CSS:
In the cells, use e.g.

<strong>The California Academy of Sciences</strong>
<span class="large-font">Timeline Wall</span>
<span class="small-font">Description</span>
<em>In collaboration with Volume Inc.</em>
dots or numbers

and in the “Custom CSS” add (only necessary once)

.tablepress .large-font {
  font-size: 30px;
}
.tablepress .small-font {
  font-size: 8px;
}

Those names (large-font and small-font) were chosen arbitrarily and you can adjust/replace/extend those as desired. It’s just important that they are the same in the HTML code and in the “Custom CSS”.

Regards,
Tobias

Thanks again, Tobias. I’ll check it out!
Best, Margot P.

Hi,

no problem, you are very welcome! ??

Best wishes,
Tobias