从 React Twitter Embed 的 TwitterTweetEmbed 组件中删除边距答案

【问题标题】：Removing margin from React Twitter Embed's TwitterTweetEmbed component从 React Twitter Embed 的 TwitterTweetEmbed 组件中删除边距
【发布时间】：2020-06-01 13:16:52
【问题描述】：

我正在使用 Material UI，并且有一个来自 React Twitter Embed 的 TwitterTweetEmbed，我不知道如何删除顶部和底部边距。

这是我当前的代码：

const styles = theme => ({
  listItem: {
    padding: '0px',
  },
  tweetSize: {
    margin: 0,
  },
  tweet: {
    margin: 0,
  }
});


class TweetItem extends Component {

  render() {
    return (
      <ListItem className={this.props.classes.listItem}>
        <div className={this.props.classes.tweetSize}>
          <TwitterTweetEmbed className={this.props.classes.tweet} tweetId={blah} options={{ width: 'auto'}} />

        </div>
      </ListItem>
    );
  }
}

export default withStyles(styles)(TweetItem);

另外，使用 Chrome 中的检查工具，我发现边距出现在这里：

这就是它们在页面上的样子：

有没有办法以任何必要的方式将这些边距强制为 0？

【问题讨论】：

标签： css reactjs twitter material-ui

【解决方案1】：

我找到的解决方案就是添加

marginTop: '-10px'

到 listItem 样式。

【讨论】：

虽然，有一个“注入” CSS 或类似的实际解决方案仍然会很好，因为我也想从嵌入中删除边框半径。