React Grid with Radium styles for 4 columns

Grid_4col.js

import React, {PropTypes} from 'react';
import Radium from 'radium';
import withWidth2, {
    X_SMALL,
    SMALL,
    H_SMALL,
    MEDIUM,
    X_MEDIUM,
    LARGE
} from '../../../../../../../../../webapp/scripts/withWidth2.js';

class Grid_4col extends React.Component {
    static propTypes = {
        gridCol_1: PropTypes.object.isRequired,
        gridCol_2: PropTypes.object.isRequired,
        gridCol_3: PropTypes.object.isRequired,
        gridCol_4: PropTypes.object.isRequired,
        rowPadding: PropTypes.string,
        colPadding: PropTypes.string

    };

    getStyles() {
        let {width, rowPadding, colPadding}= this.props;
        const styles = {
            gridRow: {
                position: 'relative',
                boxSizing: 'border-box',
                width: '100%',
                maxWidth: '100%'
            },
            gridCol: {
                display: 'inline-block',
                verticalAlign: 'top',
                width: '25%'
            },
            rowContainer: {
                padding: rowPadding ? rowPadding : '0 5px'
            },
            colPadding: {
                padding: colPadding ? colPadding : '5px'
            }
        };
        if (width === X_SMALL || width === SMALL) {
            styles.gridCol.width = '100%'
        }
        if (width === H_SMALL) {
            styles.gridCol.width = '50%'
        }

        return styles;
    }

    render() {
        const styles = this.getStyles();
        return (
            <div style={styles.rowContainer}>
                <div style={styles.gridRow}>
                    <div style={styles.gridCol}>
                        <div style={styles.colPadding}>
                            {this.props.gridCol_1}
                        </div>
                    </div>
                    <div style={styles.gridCol}>
                        <div style={styles.colPadding}>
                            {this.props.gridCol_2}
                        </div>
                    </div>
                    <div style={styles.gridCol}>
                        <div style={styles.colPadding}>
                            {this.props.gridCol_3}
                        </div>
                    </div>
                    <div style={styles.gridCol}>
                        <div style={styles.colPadding}>
                            {this.props.gridCol_4}
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}
export default withWidth2()(Radium(Grid_4col));