Collapsing Header - Fixed Centre

[Guest]

Hi again, after reading many mods and contributions etc, i have now changed most of the basic structure, however...

I have seen some discussion regarding a 'collapsing header' for and expanding/collapsing logo etc. (www.herbalhaze.co.uk/shop)

 

Basically i have three parts to the logo 'logo1' (to remain FIXED) and a 'Left' and 'right' image that i want to collapse depending upon the browser width.

 

I have been trying various configs but still dont get the result Im after...

 

I have been using html and this was my last attempt!

 

<table width="100%" border="0" align="center">
 <tr align="left">
   <td><div align="left"><img src="/shop/images/edgeL.jpg" width="%" height="112" alt="edgeL" /></div></td>
   <td><div align="center"><img src="/shop/images/logo1.jpg" width="500" height="112" alt="logo" /></div></td>
   <td><div align="right"><img src="/shop/images/edgeR.jpg" width="%" height="112" alt="edgeR" /></div></td>
 </tr>
</table>

 

Basically i have three parts to the logo 'logo1' (to remain FIXED) and a 'Left' and 'right' image that i want to collapse depending upon the browser width.

 

I know CSS do this job very neatly, but the stylesheet for OsComm is fixed column edges.

 

I am overlooking something really simple here or am i trying to attempt this in the wrong way?

any help appreciated.

[Guest]

Sussed it... the problem was with justifying the left and right to 'left and right'

also with sizing... i changed them to 100% and all is fine!

 

The central part of the logo remains constant and the L and R parts expand/squash!

 

<table width="100%" border="0" align="center">
 <tr align="left">
   <td width="%"><div align="justify"><img src="/shop/images/edgeL.jpg" width="100%" height="112" alt="edgeL" /></div></td>
   <td width="500"><div align="center"><a href="www.herbalhaze.co.uk"><img src="/shop/images/logo1.jpg" width="500" height="112" border="0" alt="Home"/></a></div></td>
   <td width="%"><div align="justify"><img src="/shop/images/edgeR.jpg" width="100%" height="112" alt="edgeR" /></div></td>
 </tr>