Muddasir Abbas
Muddasir Abbas

Reputation: 1819

Bootstrap Two columns side by side one full width with image other with in container with text

I am trying to achieve this output enter image description here

I want to show this text with in red box & red box mean with in container. right side is fine but left side having issues..

i tried this

<style type="text/css"> 
.p-r {
    padding-right: 0;
    padding-left: 0;
    }</style>

<div class="container-fluid">

    <div class="row">

      <div class="col-md-6">
          <h1>SCANNING & DIGITIZATION</h1>
          <p>We are engaged in all forms of document digitization, image scan & data capture. From microfilm / microfiche and aperture card scanning, to automated invoice processing, through to large format scanning and everything in between. We process well over a million per pages a month on site or in our client’s offices. We have decades of experience, a highly knowledgeable staff and scalable capacity. With clients from virtually every industry, we are used to tight turnarounds and can provide the software, hardware, and manpower to assist with backfile conversion or document digitization, freeing you to concentrate on business.</p>
      </div>

      <div class="col-md-6 p-r">
        <img src="https://i.sstatic.net/zOGb2.jpg" class="img-responsive img-full">
      </div>

    </div>

  </div>

Upvotes: 0

Views: 1898

Answers (1)

Nikola Kostov
Nikola Kostov

Reputation: 418

Is this what you are looking for: jsfiddle.net

.p-r:before {
 content: '';
 position: absolute;
 width: 200%;
 height: 100%;
 left: 0;
 bottom: 0;
 background: url(https://i.sstatic.net/zOGb2.jpg) no-repeat center;
 background-size: cover;
}

Upvotes: 1

Related Questions