Spacing Between Rows with Materialize CSS
Use These Methods:
.row .col{
padding: 0 !important;
}
Then the problem with unwanted space will be go away. Next you can add any other style to your div
I did this to make fast space with clear and margin if i need to.
<div class="clear-10"></div>
.clear, .clear-10, .clear-15 {
clear: both;
height: 0; overflow: hidden; /* Précaution pour IE 7 */
}
.clear-10 {
margin-bottom: 10px
}
.clear-15 {
margin-bottom: 15px
}
I figured it out. Put each col
within a single row
will eliminate the vertical spacing.
<div class="row">
<div class="col s12" style="text-align: center;">
foobar
</div>
<div class="col s12" style="text-align: center;">
12345
</div>
</div>
It is confusing but it works. Conceptually, I would think that a "row" is like a table row, forcing everything inside it to be on a single row regardless of size, but this does work since each col
has s12
(full width) size. Hope this answer helps someone else.