Column width
-
Originally when I created a table with images in the left column and text in the right, I was able to change the width of the image column without any difficulty. However, when I then decided to make some changes to the table, because I learned how to resize images in the correct way with this online resource — https://www.seedprod.com/how-to-resize-an-image-in-wordpress/ — the images on my table changed to be wrong, being different sizes in a jumbled sort of way. It was then that I found that the way to change the width that had previously been available to me without any difficulty was no longer available. So eventually I gave up trying to change the width via that method, and decided to create a new table. This worked for the first table, albeit I wasn’t able to choose the width of the images myself, but it was automatically set at an appropriate width for that table. But I have two tables on the webpage, one above the other, with a heading between them so that they cannot be joined together. When I created the second table, the width of the images was again automatically set, and this time it was an an inappropriate size being way too small. And of course, aesthetically it is important for the images in both tables to be the same width. So not being able to manually change the width of the image column is extremely annoying, as it is destroying the look of the tables, which previously had looked perfect.
WP.com: Unknown
Jetpack: Unknown
Correct account: Unknown -
I have found an additional problem. I tried creating a table on another webpage, and this time was presented with the option to have settings such as 30% and 70% for the column width. A 30% setting for the left column is still too much for the image width, but it is at least closer to what I want. Ideally, the image width would be 20%. So anyway, although this seemed like a way to resolve the problem, when I went back to the webpage where I have two tables with the image width being jumbled, I tried again creating a new table, in the hope that I would be presented with the same option to have settings such as 30% and 70%. But I wasn’t presented with this option. So that makes it even more annoying. I also did Google searches and found the following:
https://docs.wpbeaverbuilder.com/beaver-builder/layouts/columns/edit-a-column
But none of the options that the above website explains can be used to change the layout for a table are available to me. So that makes it even more annoying. It seems like WordPress is making such options to edit inaccessible for no logical reason.
-
I have found another post on the forum that is relevant:
https://wordpress.com/forums/topic/how-to-resize-column-and-row/
This page gives you information on creating a basic Table Block, but the Table Block doesn’t seem to allow for customizing cell widths or heights at the moment, but you can still achieve your desired effect.
To create a table with custom width and heights, if you know some HTML you could do so in a “Custom HTML” block instead.
Otherwise, to get a head start with the table block:
1) Create your table using the Table Block with it’s default widths and heights.
2) Click on the vertical row of three dots in the top right of the block (“More Options”) and choose “Edit as HTML.”
3) In case you’re not familiar with HTML, each table cell is a “<td>” (and they are grouped in rows (“<tr>”).
You can set the height of a row by giving the <tr> a height attribute. For example <tr height=”150″> would set the height of that row to 150px.
To set the width of a column, give one of the <td> cells the desired width. For example <td width=”300″> would set the width of that column to 300px. You can also use a percentage here, in which case <td width=”30%” would set that column’s width to 30% of the total table width.
4) You will then get a message saying “This block contains unexpected or invalid content.” Choose “Convert to HTML.”
5) Your block is now a Custom HTML block containing your table, which you can view as either HTML or Preview using the buttons at the top of the block.
However, when I followed this advise, I found the width is 150px in the HTML for both tables, which is what I want it to be. So as the HTML is correct, why are the images in the table jumbled in size? It doesn’t make any sense.
South Korean Winter Street Food
<figure class=”wp-block-table”><table><tbody><tr><td>
</td><td>Hotteok (호떡) is a pancake filled with a sweet mixture, which may contain brown sugar, honey, chopped peanuts, and cinnamon.</td></tr><tr><td><img class=”wp-image-641″ style=”width: 150px;”Kkochi (꼬치) – a category of Korean food cooked on skewers
<figure class=”wp-block-table”><table><tbody><tr><td>
</td><td>Hotteok (호떡) is a pancake filled with a sweet mixture, which may contain brown sugar, honey, chopped peanuts, and cinnamon.</td></tr><tr><td><img class=”wp-image-641″ style=”width: 150px;” In both cases above, the image width is as it should be, 150px. However, there is a difference.
In the table for Winter Street Food, the general image setting is wp-image-639, while the specific image setting for Hotteok is wp-image-641.
Likewise for Kkochi, food cooked on skewers, both are 150px, but the general image setting is wp-image-639, and the specific image setting is wp-image-641.
-
In the above I accidentally copy-and-pasted the wrong HTML for the second table, as it is the same as for the first table, so I am now copy-and-pasting the right HTML for that table.
<figure class=”wp-block-table”><table><tbody><tr><td>
</td><td>cheese-tteok-kkochi or chijeu-tteok-kkochi (치즈떡꼬치; -
Hi @reubenjfraser, apologies for missing this sooner. Sometimes when you reply to your own thread, the community sees that and assumes you have someone helping. We’ll work on that.
In the meantime, can you send a link to the affected page? It sounds like you might be using the free WordPress software, which is different from our hosted services. If you are using that, I’d recommend the forums at https://wordpress.org/support/forums/ for advice.
- The topic ‘Column width’ is closed to new replies.
WordPress.com Forums 