html - Position of the title in 960gs -

hy. work 960gs (12 columns) , try put title after logo in bottom part of it. solution find doesn't work because place title under logo.

html:     <div id="header" >     <div class="container_12">       <header>         <div class="grid_4">             <a href="index.html" title="pagina principala - crce" rel="home">                 <img src="images/crce_logo.png" alt="logo crce"/>             </a>         </div>         <div id="titleposition"class="grid_10">             <a href="index.html" title="" rel="home">                 <img src="images/titlu_crce.png" alt=""/>             </a>         </div>  </header> </div> </div>   css:   #header{     background: #798af7;     background-repeat: repeat-x;     height: 205px;     overflow: visible;     border-bottom: 30px solid #37459d;     display: block;    }    #titleposition{     position: bottom;     }    

the logo on 4 columns , title on 10 columns. put language chooser(selector) , fb logo in right top think that's challenge. i've attached image details too, see how want @ final header

i don't think can use columns in fashion, should sum 12.

because logo first column overlaps on second. make logo column 2 cols , have title 10 cols.

<div class="grid-container">  <div class="grid-2 logo-wrapper">    <img class="logo" src="logo.jpg">  </div>  <div class="grid-10">    <!-- how grids can nested further-->    <div class="grid-container">      <div class="grid-10 text-right"> language selector</div>      <div class="grid-10 text-right"> facebook </div>      <!-- can use top margin -->      <div class="top30px grid-12"> title</div>    </div>  </div> </div> 

now set logo image absolute position

.logo {  position:absolute;  left:0;  right:0; } 

then parent around .logo set relative.

.logo-wrapper  {   position:relative;  } 

i have given solution considering pseudo grid system, because haven't used 960gs - grid system.

general idea:

you can consider following 3 element in different rows occupying 10 columns

1. language selector

2. facebook icon ,

3. site title

tips:

• avoid absolute position title can achieve through nested grids shown in above html
• use top margin push title further below required position.