div不会水平扩展 [英] div doesn't expand all the way horizontally

问题描述

为什么我的div左右有空格？

Why is there white space to the left and right of my div?

render() {
    return (
        <div className="container intro-body">
            <div className="row">
                <h2 className="intro-name center-block">TEXT</h2>
            </div>
        </div>
    )
}

在我的 css ：

.intro-body {
    height: 500px;
    background-color: #3BC5C3;
}

我尝试设置 body 到 margin：0 和 padding：0 ，认为它与Bootstrap的默认值有关，它没有工作。我还没有一个容器，为什么它仍然有填充？

I've tried to set body to margin: 0 and padding: 0, thinking it had to do with Bootstrap's default values, but it didn't work. I also don't have a container so why does it still have padding?

推荐答案

问题是container Bootstrap也应用了这样的样式 - 使用container-fluid来获取完整的宽度。

The issue is the "container" class - Bootstrap also applies a styling of this - use "container-fluid" to get the full width.

render() {
    return (
        <div className="container-fluid intro-body">
            <div className="row ">
                <h2 className="intro-name center-block">TEXT</h2>
            </div>
        </div>
    )
}

这篇关于div不会水平扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！