On a blog-type webpages (like on this page), photos are presented mainly in groups of two or four (in 1 or 2 lines of photos). Each photo container is centered and has a width calculated in such a way that portrait photos do not look bigger than landscape photos, with a last visual adjustment. To do that, I need to set the width of the photos container in accordance with the five classes “2 landscape photos”, “1 landscape and i portrait”, or “two portrait” plus the occasional “single landscape” and “single portrait”.

Five styles are used and I want to determine their respective “width” value with a javascript for the page. Depending on the final look of the webpage, the container width for two landscape photos could be set anywhere between 66% and 100% of the page width, and all others need to be adjusted in proportion.

Elaborating on a w3schools page, i have succeeded to set a fixed value to the width of each class value, which is a quite complex equivalent to simply setting the value for width in the style sheet. The problem is:
Whenever I try to replace, in the command ‘collection.style.width = “100%”‘, the fixed value “100%” by a variable, I fail.

What can i do to correct the script ?