Background images for tiles in webhelp responsive

[Edwin]

Hi,
we've managed to add images to the webhelp tiles, but would prefer to have the image as a background of the tile itself. Is there a quick way to achieve this?

[Costin]

Hello,

In your customization CSS, you should use the "background-image" property in a rule that matches your WebHelp tiles.
Something like:

Code: Select all

*[class=" wh_tile  "]{

    background-image: url("your_own_image.png");

}

Regards,
Costin

[Edwin]

Hi Costin, fair enough but that would give us the same image for all tiles. We would like an image per tile.

[Costin]

Edwin,

If you need to use different image backgrounds for different tiles, then you should use more specific selectors.
For example:

Code: Select all

div[class=" wh_tiles "] > div[class=" wh_tile  "]:nth-of-type(1){

    background-image:url("your_own_image.png");

}

To match other tiles you should use nth-of-type(2), nth-of-type(3), ASO.
Of course, you could also use :first-of-type / :last-of-type pseudo classes to match 1st / last tiles.

Regards,
Costin

[Edwin]

Thanks, works like a dream