Абсолютный элемент в пределах относительного родителя с максимальной шириной

Question

Я пытаюсь установить в правом нижнем углу #header-image (перекрытие). Трудная часть делает это, установив max-width из 1280px на #header-supporter-cont, чтобы он соответствовал остальной части поля сайта.

Я попытался размещение непосредственно в #header, но я не могу использовать, потому что max-width#header-image должен быть полной шириной.

Вот моя разметка:

<header id="header"> 
    <div id="header-image"> 
     <a href="#"><img src="http://placeholdit.imgix.net/~text?txtsize=44&txt=Header&w=1920&h=200" /></a> 
    </div> 
    <div id="header-supporter-cont"> 
     <div id="header-supporter"> 
     <div> 
      Lead Supporter 
     </div> 
     <img src="http://placeholdit.imgix.net/~text?txtsize=14&w=65&h=65" /> 
     </div> 
    </div> 
    </header> 

Вот Pen: http://codepen.io/ourcore/pen/ObBWaY.

Answer 1

выставиться в положение: относительно на # заголовочном-сторонника-CONT, и снизу, а не сверху на # заголовочном-сторонника

http://codepen.io/anon/pen/ENdWgE

#header-supporter-cont { 
    margin: 0 auto; 
    max-width: 1280px; 
    position: relative; 

    #header-supporter { 
    position: absolute; 
    bottom: 0; 
    right: 0; 
    }