Text and images alignment in table

[MadKiwiCap]

I’ve been trying to align text and images in the same row but the following is happening:

PDF output.png

I know this is a Style Sheet issue, but not sure if I need to update the CSS or Table Style Sheet.
This is how it looks in the Madcap source file:

Madcap input.png

And this is the code:

Code.png

Do I need to create a new CSS to be implemented withing the table row or update the Table Style Sheet?

[robdocsmith]

The differences between the three brake icons aligning differently with text are because the first is in a set of para tags and the second and third are not. Each pair would have to be in a <p><img src="something" />Text here</p> structure. The first icon row is how it would normally be displayed with this structure.

I'd be tempted to split the cell into three rows and two columns then place the icons in the first column and description text in the second column. Then you should be able to vertical align the text/icon pairs how you want.

Rob

[MadKiwiCap]

Thank you for your response Rob.
I moved the images to it's own column, and the text are now nicely aligned.

PDF output2.png

Unfortunately I can't seem to get the images centered and tried to edit CSS but still no joy:

CSS.png

Again, here is the relevant code:

Code2.png

And the Madcap input:

Madcap input2.png

Please advise if these images can be centered, or if this is the best I could get?

[robdocsmith]

The centring will depend on a few things so you'd have to do a bit of investigation to work out where the space is coming from:

• The image graphic itself might contain white space - you'd need to edit the image outside of Flare to change this
• The image might have padding or margin in the img style.
• The table cell (td) could have some padding inside it.
• The table row (tr) might have a height definition that is larger than the image height and the vertical-align of the row set to 'top'.

Nothing for it but to check around all the tags containing that image (as well as the image itself) and see if you can work out where the white space is being added.

Rob