CSS - Basic Animation

by Rodwyn Moreno

HTML

<p>
- Juan, ¿Qué es peor, la ignorancia o la indiferencia?<br />
- Ni lo se, ni me importa
</p>

CSS

p {
  animation-duration: 3s;
  animation-name: slidein;
  
  background: #E0DFB1;
  border: #A5A36C solid thin;
  color: #535233;
  font-size: 20px;
  padding: 15px;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%;
  }
  
  to {
    margin-left: 0%;
    width: 100%;
  }
}