Как сделать чтобы элемент внутри контейнера отступил от верхнего края этого контейнера?

Получается вместо того чтобы внутри контейнера отсутуить, вложенный блок отступает относительно окна браузера и при этом вместе с ним сдвигается блок который его и содержит внутри себя, как решить?



html:

<div class="b-header">
		<div class="b-logo-container">
			<div class="b-logo-container--info">
				<a href=#>
					<img src="header/logo.png" alt="" />
				</a>
				Free shipping over $100
				<div class="b-logo-container--info__phone">
					Need Help? 1 - 800 - 123 - 1234
				</div>
			</div>
		</div>
		<div class="b-menu-container">
			<nav class="b-menu-container--nav">
				<ul>
					<li>
						Home
					</li>
					<li>
						Fashion
					</li>
				</ul>
			</nav>
		</div>
		<div class="b-header--bottom">
		</div>
	</div>

css:

.b-header{
	height: 347px;
	position: relative;
	background-color: #f6f1ec;
	background-image: url('bg.png');
}
	.b-header--bottom{
		width: 100%;
		bottom: 0;
		position: absolute;
		height: 36px;
		background-image: url('bg-img.png');
	}
.b-logo-container{
	margin: 44px 0 36px;
    /*line-height: 25px*/
}
	.b-logo-container--info{
		overflow: hidden;
		text-align: center;
		font-size: 14px;
		color: #666666;
		height: 37px;
		line-height: 37px;
	}
	.b-logo-container--info a{
		float: left;
	}		
		.b-logo-container--info__phone{
			display: inline-block;
			height: 37px;
			background: url('header-line.png') 0 50% no-repeat;
			margin-left: 20px;
			padding-left: 20px;
		}