In my webapp I have several places (like user profile) where I use a columns to place propertyName -> propertyValue pairs. Sometimes property values are short and I can afford having both property name and value in one row but sometimes property values are big ( like cloud of user interests or paragraph describing something) so it makes sense to devote whole new row to property_value.
Are there any recommended ways how I can (mostly with means of singularity.gs) make property-value go to another row if property-value is too long?
It's really tricky to answer without knowing more about the web app. Generally speaking I'd wrap the key value pairs in a div and attach a class to the wrapper that styles the elements inside.
EG. If the Key-Value is "big" use block elements, if its "small" use inline-blocks to stay inline .
I'd use singularity to layout the outer wrappers, not the elements themselves. Basic CSS should cover the inner elements. If you don't know the length of the data coming out of a given key-value pair then I don't think CSS alone can solve your challenge. JS, or server side scripting will likely be needed to attach the appropriate wrapper classes described above.