Responsive image grid

<!DOCTYPE html>
<html>
<head>
	<title>Responsive image grid | Par 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="keyword" content="Responsive image grid">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css">  	
	<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
	<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body class="container">
	<div class="row">	
	    <div class="col-lg-12">
		<div class="container-fluid Blockimg">
			  <div class="container">
				  <div class="row">
				  <div class="col-md-12">
					  <div class="col-md-10">
					    <div class="col-md-4">  
						<img src="https://place-hold.it/260x200"class="img-responsive">
						  <span>lorem ipsum lorem ipsum </span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x400"class="img-responsive">
						<span style="top: 50%">lorem ipsum lorem ipsum</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x200"class="img-responsive">
						  <span style="top: 85%">lorem ipsum lorem ipsum lorem</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						</div>
						 <div class="col-md-4 col-xs-12">
						<img src="https://place-hold.it/260x300"class="img-responsive">
						<span style="top: 18%; margin-left: 15px;">lorem ipsum lorem ipsum lorem</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x200"class="img-responsive">
						<span style="top: 50%">lorem ipsum lorem ipsum lorem</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x300"class="img-responsive">
						<span style="top: 85%">lorem ipsum lorem ipsum lorem?</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						</div> 
					   <div class="col-md-4 col-xs-12">
						<img src="https://place-hold.it/260x200" class="img-responsive">
						<span>lorem ipsum lorem ipsum lorem ipsum</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x400" class="img-responsive">
						<span style="top: 50%">lorem ipsum lorem ipsum lorem</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						<img src="https://place-hold.it/260x200" class="img-responsive">
						<span style="top: 85%">lorem ipsum lorem ipsum lorem</span>
						<button type="button" class="btn btn-lg">Lire la suite</button>
						</div>
					  </div>
					  </div>
				  </div>
				  </div>
			  </div>
		</div>	
	</div>
</body>
</html>
.Blockimg
{
    margin-top: 30px;
}

.Blockimg img
{
    width: 100%;
}

.Blockimg span
{
    color: #fff;
    position: absolute;
    top: 10%;
    text-align: center;
    font-size: 20px;
    text-transform: uppercase;
    margin-right: 15px;
}
.Blockimg .btn-lg
{
    border-radius: 0px;
    background-color: #FFD51E;
    width: 100%;
    font-size: 11px;
    margin-top: 0px;
    margin-bottom: 5px;
    text-transform: uppercase;
    font-weight: 600;
    
}

                                    
page scroll progress bar

page scroll progress bar

Timeline style07

Timeline style07

Simple Table With UIKIT

Simple Table With UIKIT

Scroll down button 01

Scroll down button 01

Pagination with Jquery

Pagination with Jquery

Form login with background image changed style01

Form login with background image changed style01

Créer une input search animée

Créer une input search animée

Créer un effet de défilement vers le bas de la souris animé

Créer un effet de défilement vers le bas de la souris animé

Card Bootstrap4 E commerce 01

Card Bootstrap4 E commerce 01

Bootstrap4 datepicker

Bootstrap4 datepicker

Alert Bootstrap4 style01

Alert Bootstrap4 style01

Add Remove dynamic rows with dynamic ID of input in HTML table

Add Remove dynamic rows with dynamic ID of input in HTML table