Texte Block Posts Style01

<!DOCTYPE html>
<html>
<head>
  <title>Texte Block Posts Style01 | NGLESSON</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Mezgani said">
  <meta name="copyright" content="NGLESSON">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="container">
	<div class="row mt-5 mb-5">
<div class="max-w-screen-xl mx-auto p-5 sm:p-10 md:p-16 relative">
  <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-10">
    <div class="flex flex-col justify-between border-b pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Cristiano Ronaldo of Juventus FC looks dejected during the...</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
    <div class="flex flex-col justify-between border-b pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Bests of Leonel Messi (Videos, Images & Quotes)</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
    <div class="flex flex-col justify-between border-b pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Juventus v Olympique Lyon</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
    <div class="flex flex-col justify-between pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Bests of Leonel Messi (Videos, Images & Quotes)</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
    <div class="flex flex-col justify-between pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Juventus v Olympique Lyon Best Ronaldo Images</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
    <div class="flex flex-col justify-between pb-5">
      <a href="#" class="text-gray-900 font-medium hover:text-indigo-600">Cristiano Ronaldo of Juventus FC looks dejected during the...</a>
    <div class="flex items-start justify-between mt-3">
      <div class="text-sm w-2/3">
        <p class="text-gray-700">Cristiano Ronaldo of Juventus FC looks dejected during the...</p>
        <p class="text-gray-600 text-xs">Aug 18</p>
      </div>
      <a href="#" class="inline-block ml-2"><div class="w-20 h-20 bg-cover bg-center bg-img" ></div></a>
    </div>
  </div>
  </div>
</div>
</div>
</div>
</body>
</html>
.bg-img{
  background: url(http://placeimg.com/640/360/any) center center;
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

                                    
Timeline style07

Timeline style07

Timeline style06

Timeline style06

Timeline style03

Timeline style03

Tablet style code texte

Tablet style code texte

Scroll to div ID

Scroll to div ID

Image hover effects style

Image hover effects style

Image hover 06

Image hover 06

Form login with background image changed style01

Form login with background image changed style01

Form Création de compte

Form Création de compte

Comment intégrer yamli dans une input

Comment intégrer yamli dans une input

Chercher un mot sur la liste

Chercher un mot sur la liste

Asidebar Bootstrap4 style02

Asidebar Bootstrap4 style02