Closed
Description
ReactCSSTransitionGroup by default render span component. And it introduce new dom element, that need to be counted in CSS, for example when using flex box layout:
<div class="row">
<span>
<div class="element"></div>
</span>
</div>
Problems that I see here:
- Span by default is inline element, so I need to redefine CSS styles for it
- CSS becomes more complex, above example will require to write CSS like this:
.row > span { /* and we forced to use > here */
display: flex;
}
Working example here: http://jsfiddle.net/c60328nv/1/
React.js documentation offers two options:
- use React.DOM.div
- write own component
Ok, I can write my own component: FlewRow, and FlexColumn (for flex-direction: column).
But with this solution I'll endup with a lot of components, which just basically render one div element with different classes:
- FlexRow:
- FlexRowReverse:
- FlexColumn:
- FlexColumnReverse:
Any way to specify properties for transition group component? I didn't find anything in source code or documentation
Metadata
Metadata
Assignees
Labels
No labels