How come my div is not affected by the foundation grid system:
render: function(){
var {todos,showCompleted,searchText} = this.state;
var filteredTodos = TodoAPI.filterTodos(todos,showCompleted,searchText);
return (
<div>
<h1 className="page-title">Todo App</h1>
<div className="row">
<div className="column small-centered small-5 medium-6 large-5">
<div className="container">
<TodoSearch onSearch = {this.handleSearch} />
<TodoList todos ={filteredTodos} onToggle ={this.handleToggle}/>
<AddTodo onAddTodo ={this.handleAddTodo}/>
</div>
</div>
</div>
</div>
);
}
When using firebug to debug the style, I couldn't find :
.large-5 {
width: 33.3333%;
}
You can access the project repository here