reactjs - 如何填充整个宽度(React.js)？

Question

我是 React.js 的新手，我注意到的第一件事是页面的整个宽度没有被填满。这是我的 JS 代码:

var Navbar = React.createClass({
    render: function(){
        return(
            <div className="navbar"> </div>
        );
    }
});

ReactDOM.render( <Navbar/>,document.getElementById('test') );

和 CSS:

.navbar{
    background-color: green;
    width: 100%;
    height: 3em;
}

顶部、左侧、右侧有 3 像素的意外边距。

Answer 1

你的 body 要么有边距，要么有填充。您可以删除，但随后它会弄乱您想要均匀填充的页面的其他区域。另一种选择是您可以固定导航栏位置。这将忽略填充/边距。

.navbar{
  position: fixed;
  top: 0;
  left: 0;
  background-color: green;
  width: 100%;
  height: 3em;
}

http://codepen.io/finalfreq/pen/VKPXoN