960 grid question

[warrenerjm]

Hi

 

I am trying to line everything up & it isn't working as I would think from reading various tutorials?

 

My header is split into three.

 

Logo (grid_6 alpha)- space to be filled later(grid_6) - cart (grid_6 omega)

headerMenu (Grid_24)

 

This makes the right not line up? Somewhere I read that grid_24 was 950 & not 960. Is this what I am seeing & how do I correct it please?

 

<div id="header" class="grid_24">
 <div class="grid_12 alpha"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'store_logo.png', STORE_NAME) . '</a>'; ?></div>

 <div class="grid_6"> </div>  

 <div class="grid_6 omega">

<div class="headercartContents">

 

 

I also read that if you have a grid_24 or anything crossing one side of a grid to the other it needs to have the alpha & omega added, but this puts the left side out of line?

 

This must be all to do with the white areas of the columns 5px either side, but how do I work with these to line the edges up please?

 

<div class="grid_24 alpha omega headerMenu">

 

 

<div class="grid_24 headerMenu">

 

lines up with the column headers nicely.

 

Thanks

[Xpajun]

There are 3 simple 960 grid tutorials HERE that might well answer your questions

[warrenerjm]

I fixed it. I had the image box at 240px because I thought there was a 5px either side of the grid_6, but it looks like the 5px on the left & right of a grid_24 isn't counted? Equalling 950 & not 960.

 

Clear as mud! :lol:

[warrenerjm]

There are 3 simple 960 grid tutorials HERE that might well answer your questions

Thanks Julian

 

I've bookmarked these already & read them time & again. :)

 

This helped too.