Materialize framework problems
I have this simple div:
<div class="container">
<div class="hoverable col s12 l4 m4">
Hoverable div.
</div>
</div>
The sensitive effect does not work when leaving the mouse when it works on mouseover.
As long as I'm using the l4 and m4 classes, the div still spans 12 columns on the laptop screen.
+3
source to share
1 answer
You need to put columns inside the row. Like this:
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css" rel="stylesheet"/><script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"></script>
<div class="container">
<div class="row">
<div class="hoverable col s12 m4 l4">Hoverable div.</div>
</div>
</div>
EDIT : you need to add the following css:
.hoverable{
transition: box-shadow 0.25s ease 0s;
}
+1
source to share