Semantic-ui-react: fix(Divider): Vertical Divider on docs rendered incorrectly

[val-samonte]

Steps to Reproduce

1. Use in a Grid component

Expected
The Divider should render between Grid.Columns

Result
The Divider instead render on the left side

Testcase
http://react.semantic-ui.com/elements/divider#divider-example-vertical

[levithomason]

There is a W3C spec change issue causing this bug in the CSS:

https://github.com/Semantic-Org/Semantic-UI/issues/4342

[levithomason]

Note, you can work around this by putting dividers inside of a column rather than in between them:

import React from 'react'
import { Grid, Segment, Divider } from 'semantic-ui-react'

const DividerExampleVertical = () => (
  <Grid columns='equal' padded>
    <Grid.Column>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio.
    </Grid.Column>
    <Grid.Column width='1'>
      <Divider vertical>Or</Divider>
    </Grid.Column>
    <Grid.Column>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio.
    </Grid.Column>
    <Grid.Column width='1'>
      <Divider vertical>Or</Divider>
    </Grid.Column>
    <Grid.Column>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio.
    </Grid.Column>
  </Grid>
)

export default DividerExampleVertical

[val-samonte]

thanks @levithomason, sorry i forgot to check the open issues.

[levithomason]

No worries.