Переполнение не работает вообще в моем компоненте React

Question

по какой-то причине переполнение вообще не отображается в моем компоненте. Я перепробовал все, что могу придумать, но ничего не получается. Я использую vh и устанавливаю высоту всего на этой странице так, чтобы она все подходила, и я использую flexbox, чтобы расположить почти все, не уверенный, вызывает ли это то или иное. Я попытался просто добавить его в текст, который переполняет div, чтобы скрыть этот текст, но он не работает. Понятия не имею, что происходит.

Я включаю только тот компонент, в который хочу добавить переполнение.

import React from 'react';
import { withStyles } from '@material-ui/styles';
import rockClimbing from '../img/rock-climbing.svg';
import facebookcolor from '../Icons/Social/color/Kangy_social_facebook.svg';
import twittercolor from '../Icons/Social/color/Kangy_social_twitter.svg';
import pinterestcolor from '../Icons/Social/color/Kangy_social_pinterest.svg';

const styles = theme => ({
  postScheduled: {
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'center',
    textAlign: 'center',
    marginTop: '50px',
  },
  draftWrap: {
    width: '100%',
    overflowY: 'visible',
    display: 'flex',
    flexWrap: 'wrap',
    justifyContent: 'center',
    alignItems: 'flex-start',
    marginTop: '50px',
  },
  draftItem: {
    width: '19%',
    display: 'inline-block',
    margin: '1%',
    cursor: 'pointer',
    borderRadius: '10px',
    padding: '20px',
    textAlign: 'center',
    backgroundColor: '#FAFAFA',
    '& img': {
      width: '100%',
      height: '100%',
      borderRadius: '10px',
      objectFit: 'cover',
    },
  },
  socialIconsWrap: {
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    '& img': {
      width: '30px',
    },
  }
});

class Drafts extends React.Component {

  render() {
    const { classes } = this.props;

    return (
      <div>
        { drafts.length === 0 &&
          <div className={classes.postScheduled}>
            <img src={rockClimbing} alt="no pics available" />
            <h2 className={classes.nodraftText}>Wow! Looks like there's nothing here.</h2>
          </div>
        }
        { drafts.length > 0 &&
          <div className={classes.draftWrap}>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
            <div className={classes.draftItem}>
              <img src="http://images.summitmedia-digital.com/smartpar/images/smallfamilyadv.jpg" alt="fun" />
              <h3>Post title goes here</h3>
              <div className={classes.socialIconsWrap}>
                <img src={twittercolor} alt="twitter" />
                <img src={facebookcolor} alt="facebook" />
                <img src={pinterestcolor} alt="pinterest" />
              </div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor nec urna consectetur, id placerat orci congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque convallis velit quis hendrerit euismod. Donec feugiat iaculis mauris, suscipit pretium mi egestas nec.</p>
            </div>
          </div>
        }
      </div>
    )
  }
}

export default withStyles(styles)(Drafts);