The community member is looking for a way to have every second item in a content edit mode reversed, either by adding a "reverse" token or using a CSS :nth selector. They wonder if there is a native way to do this in Webstudio, as they have a screenshot of an example where the middle item has a "reverse" token and each parent has a different CSS property value. The community member assumes this would need to be handled with JavaScript or embedded CSS.
In the comments, another community member suggests two options: adding a class to the template and targeting the class in custom CSS with a :nth selector, or creating two templates (Image Left and Image Right) and letting the client respect the order. The original community member states they built the first option as it is super easy and the end user doesn't need to get confused with more options.
There is no explicitly marked answer in the post and comments.
Using the content edit mode, I would like to have every second item added get reversed. Done manually, I would add a "reverse" token or in CSS I would use and :nth selector (which I could still add manually). However, I wondered if there's a way to do this natively in Webstudio.
The screenshot is an example of what I'd want a client to be able to add/edit. They are all the same structure but the middle one has a "reverse" token on it and each of the parents has a different CSS property value. My assumption is that this would need to be handled with JS or embedded CSS at the moment; is that correct?
