<div class="library">
    <div id="library">
        <div class="img">
            <img src="images/b1.jpg">
        </div>
        <div class="text">
            <h3>Library</h3>
            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
            <p class="p2">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
            <button>EXPLORE</button>
        </div>
    </div>

    <div id="computer lab">
        <div class="img">
            <img src="images/b2.jpg">
        </div>
        <div class="text">
            <h3>Computer Lab</h3>
            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
            <p class="p2">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
            <button>EXPLORE</button>
        </div>
    </div>

    <div id="conference hall">
        <div class="text">
            <h3>Conference Hall</h3>
            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
            <p class="p2">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
            <button>EXPLORE</button>
        </div>
        <div class="img">
            <img src="images/b3.jpg">
        </div>
    </div>

    <div id="play ground">
        <div class="text">
            <h3>Play Ground</h3>
            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
            <p class="p2">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
            <button>EXPLORE</button>
        </div>
        <div class="img">
            <img src="images/b4.jpg">
        </div>
    </div>

</div>

​.library{
    width: 100%;
    height: 760px;
}
.library .img{
    width: 25%;
    height: 380px;
    float: left;
}
.library .text{
    width: 25%;
    height: 380px;
    float: left;
    background-color: #07cbc9;
    color: whitesmoke;
}
.library .img img{
    width: 100%;
    height: 380px;
}
.library .text h3{
    display: block;
    font-size: 24px;
    margin: 20px 0 30px 20px;
}
.library .text p{
    font-size: 16px;
    display: block;
    margin-bottom: 20px;
    margin-left: 20px;
}
.library .text p.p2{
    font-size: 14px;
    color: grey;
    margin-bottom: 30px;
    margin-left: 20px;
}
.library .text button{
    display: block;
    width: 138px;
    height: 40px;
    background-color: black;
    color: whitesmoke;
    margin: 0 auto;
}