0

Estou usando o Framework Materialize em um site, porém quando crio duas linhas ele me da esse espaçamento, alguém sabe como corrigir?

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	  <!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">

  <!-- Compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
	<title>Document</title>
</head>
<body>
	<div class="row">
		<div class="col s6 red">6</div>
		<div class="col s6 green">6</div>
	</div>

	<div class="row">
		<div class="col s6 blue">6</div>
		<div class="col s6 yellow">6</div>
	</div>
	
	
</body>
</html>

1

1 Resposta 1

1

Você precisa subscrever a class .row com valor 0 e acrescente o atributo !important, para que o mesmo possa subscrever o valor default.

Para subscrever as classes você precisa criar um novo arquivo css, e chamar ele depois do Materialize

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<link rel="stylesheet" href="/css/meu.css">

.row {
  margin-bottom: 0px !important;
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
  <title>Document</title>
</head>

<body>
  <div class="row">
    <div class="col s6 red">6</div>
    <div class="col s6 green">6</div>
  </div>

  <div class="row">
    <div class="col s6 blue">6</div>
    <div class="col s6 yellow">6</div>
  </div>


</body>

</html>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .