对齐2个元素左右引导问题

Question

Iam试图实现这种图片上的定位效果。文字从左侧有一些填充底部和顶部的文字和位置绝对的右侧图像，但我无法正确实现。有什么建议么 ？

我将分享在这里我的代码

.luma-founders { position: relative; padding: 30px 0; background: #8bc541; } 
 
.luma-founders h3 { font-family: "Questrial", sans-serif; font-size: 36px; color: #fff; margin: 79px 0 40px 0; padding: 0 11px; } 
 
.luma-founders p { font-family: "Raleway-Regular", sans-serif; font-size: 16px; line-height: 30px; color: #fff; padding: 0 11px; } 
 
.luma-crew { position: absolute; left: 50%; top: 0; right: 0; bottom: 0; } 
 
.luma-crew img { min-width: 100%; min-height: 100%; height: auto; width: auto; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="container"> 
 
    <div class="luma-founders"> 
 
    <div class="container"> 
 
     <div class="row"> 
 
     <div class="col-md-6"> 
 
      <h3>Who is Luma Comfort</h3> 
 
      <p>We at Luma Comfort want the best for you. We pride ourselves as innovators in design and functionality, to ensure that you have the best quality products to choose from.</p> 
 
      <p>Our philosophy is that comfort doesn't just come from how well our products work, but how good they make you feel to look at them in your home or office. Luma Comfort knows the importance of quality products that look beautiful too.</p> 
 
     </div> 
 
     <!-- col-md-6 --> 
 
     <div class="luma-crew"> 
 
      <img src="https://s18.postimg.org/p5pxb0r95/founders.jpg" width="783" height="510" title="someText" alt="someText"> 
 
     </div> 
 
     </div> 
 
     <!-- row --> 
 
    </div> 
 
    <!-- container -->

Answer 1

增加了一些裕.luma-crew img（即保证金左：100％;）

.luma-founders { position: relative; padding: 30px 0; background: #8bc541; } 
 
.luma-founders h3 { font-family: "Questrial", sans-serif; font-size: 36px; color: #fff; margin: 79px 0 40px 0; padding: 0 11px; } 
 
.luma-founders p { font-family: "Raleway-Regular", sans-serif; font-size: 16px; line-height: 30px; color: #fff; padding: 0 11px; } 
 
.luma-crew { position: absolute; left: 50%; top: 0; right: 0; bottom: 0; } 
 
.luma-crew img { min-width: 100%; min-height: 100%; /*height: auto; width: auto;*/ margin-left: 100%; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="container"> 
 
    <div class="luma-founders"> 
 
    <div class="container"> 
 
     <div class="row"> 
 
     <div class="col-md-6"> 
 
      <h3>Who is Luma Comfort</h3> 
 
      <p>We at Luma Comfort want the best for you. We pride ourselves as innovators in design and functionality, to ensure that you have the best quality products to choose from.</p> 
 
      <p>Our philosophy is that comfort doesn't just come from how well our products work, but how good they make you feel to look at them in your home or office. Luma Comfort knows the importance of quality products that look beautiful too.</p> 
 
     </div> 
 
     <!-- col-md-6 --> 
 
     <div class="luma-crew"> 
 
      <img src="https://s18.postimg.org/p5pxb0r95/founders.jpg" width="783" height="510" title="someText" alt="someText"> 
 
     </div> 
 
     </div> 
 
     <!-- row --> 
 
    </div> 
 
    <!-- container -->