CODEWITHSUNDEEP
reactjssemantic-ui-react
little-dude
little-dude

Reputation: 1674

react + semantic ui: access column width

I'm using the grid component, and according to the doc, the Row.Column component has a width attribute, that I'd like to access.

class MainGrid extends Component {
  render() {
    return (
      <Grid>
        <Grid.Row columns={2}>
          <Grid.Column>
            <JsonEditor
              width={???} // <---- I'd like to set the width property with the column's width property
            />
          </Grid.Column>
          <Grid.Column>
          </Grid.Column>
        </Grid.Row>

        <Grid.Row columns={1}>
        </Grid.Row>
      </Grid>
    );
  }
}

If I understand correctly, it's fine to use a Row.Column property for my JsonEditor component, because it's passing a property from a parent to a child. But I cannot figure out how to do that.

Upvotes: 0

Views: 1201

Answers (1)

rjo
rjo

Reputation: 26

Assuming JsonEditor is a wrapper for the react-ace editor, you should be able to set width to 100% to get an editor the full width of the containing column. The value is passed to the style attribute verbatim.

This means @kyaw-siesein's suggestion is on the money!

Upvotes: 1

Related Questions