Tell us what you are trying to do? align images produced with a conditional statement in blocks
Is there any documentation that you are following? no
Is there a similar example that we can see?no
What is the link to your site?hidden link
there are 3 conditional blocks within a container. If a field exists, an image is shown (the social icons at the bottom of page); if all 3 exist they line up nicely but if only one or two exist they need to display text-align: center. I've tried aligning the containers inner content, the conditional blocks, etc., nothing seems to work. the conditionals seem to occupy a space even when the conditional field doesn't exist - so no content should be present. (here's an example where all 3 fields do exist and there are 3 images: hidden link)
Hello, it sounds like you need to make each column of a 3-column grid conditional. Unfortunately in the Block Editor once you set the number of columns in a grid, that is static and cannot be managed by a conditional. I think the only way to set this up is to use some custom CSS that overrides the float and display settings for each item. For example, you could apply a custom CSS class tssupp-custom-centering to the container element, then override the styles for each figure element inside that container:
.tssupp-custom-centering {
text-align:center;
}
.tssupp-custom-centering figure.wp-block-image.tb-image.tb-image-dynamic
{
float: none;
display: inline-block;
}
thanks, i'll try this. I tried using a grid initially, but then just took them out of the grid. it seems like the conditional adds a block, even if the results of the conditional are empty. I tried floating the images but maybe my css wasn't working - i'll try yours. thank you!
I'll stand by for your update
