CSS HTML place a white square on an image -

i have div entire background of image. in middle of image want have white box has text in it. tried relative position stretched out parent.

here code

<div id="desk-linkedin-image" style="background: url('img/linkedin/at_desk_linkdenin_optimization.jpg');width: 100%;">    <div style="background-color: #ffffff; width: 475px; height: 46%;padding-left: 2%;">        <p style="font-size: 20px;"> text text text</p>      <p style="font-size: 20px;"> text text text</p>      <p style="font-size: 20px;">text text text</p>      </p>    </div>  </div>

try giving child div absolute position,then margin left , margin top,something

<div id="desk-linkedin-image" style="background: url('http://knowledgeoverflow.com/wp-content/uploads/2013/03/food_photography_burger_by_masterdev777-d3h1ryk.jpg');width: 100%;height: 100%;" >        <div style="background-color: #ffffff; height: 150px;width:150px;position: absolute; margin-left:600px; margin-top: 215px">            <p style="font-size: 20px;"> text text text</p>          <p style="font-size: 20px;"> text text text</p>          <p style="font-size: 20px;">text text text</p>          </p>        </div>      </div>