CodePen

HTML

            
              <div class="leftcolumn">
<h1>This is my heading</h1>
  <img src="http://lorempixel.com/700/200/sports/">

</div>
            
          
!

CSS

            
              .leftcolumn {
  width:960px;
  margin:0 auto;
  background:grey;
  position:relative;
  overflow:hidden;
  height:225px;
}

h1 {
  position:absolute;
  background:rgba(255,255,255,0.65);
  margin-left:10px;  
  z-index:25;
  display:inline;
  padding:.0.25em;
}

.leftcolumn img {
  diaply:block;
  position:absolute;
  top:10px;
  left:25px;
  
}


            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................