How do I add an extra column to a completed template

DSSR posted this at 01:52 — 4th December 2007.

Joined: Mar 2006

I'm trying to find where to put code for another 2 columns. 1 to the left for more buttons, and 1 to the right for some other stuff.

BUT, I want the table or text box in the middle to stay where it is.

You see, this template was designed by someone else, and also the coding, but they didn't leave me any room. They created the tables with DW and left no room to expand.

I need a column like in this picture. Not above, or below it. I need it to start at the same line as the first text line, but to the left of this white text area, and one on the opposite side for some other stuff related to the website.

<?php
<code>&#10;&lt;!DOCTYPE html PUBLIC \&quot;-//W3C//DTD XHTML 1.0 Transitional//EN\&quot; \&quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\&quot;&gt;&#10;&lt;html xmlns=\&quot;http://www.w3.org/1999/xhtml\&quot;&gt;&#10;&lt;head&gt;&#10;&lt;meta http-equiv=\&quot;Content-Type\&quot; content=\&quot;text/html; charset=iso-8859-1\&quot;/&gt;&#10;&lt;title&gt;TWT Couriers&lt;/title&gt;&#10;&lt;link href=\&quot;images/style.css\&quot; rel=\&quot;stylesheet\&quot; type=\&quot;text/css\&quot;/&gt;&#10;&lt;style type=\&quot;text/css\&quot;&gt;&#10;&lt;!--&#10;body {&#10;    margin:0px; background-color: #3F6616;&#10;    background-image: url(&#039;images/background_gradient.gif&#039;);&#10;    background-repeat: repeat-x&#10;}&#10;body, td, th {&#10;    font-family: Verdana, Arial, Helvetica, sans-serif;&#10;    font-size: 10px;&#10;    color: #93B367;&#10;}&#10;a:link {&#10;    color: #ACC58B;&#10;    text-decoration: none;&#10;}&#10;a:visited {&#10;    text-decoration: none;&#10;    color: #ACC58B;&#10;}&#10;a:hover {&#10;    text-decoration: underline;&#10;    color: #93B367;&#10;}&#10;a:active {&#10;    text-decoration: none;&#10;    color: #ACC58B;&#10;}&#10;--&gt;&#10;&lt;/style&gt;&#10;&amp;lt;script type=\&quot;text/JavaScript\&quot;&amp;gt;&#10;&lt;!--&#10;function MM_swapImgRestore() { //v3.0&#10;  var i,x,a=document.MM_sr; for(i=0;a&amp;&amp;i&lt;a.length&amp;&amp;(x=a[i])&amp;&amp;x.oSrc;i++) x.src=x.oSrc;&#10;}&#10;&#10;function MM_preloadImages() { //v3.0&#10;  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();&#10;    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i&lt;a.length; i++)&#10;    if (a[i].indexOf(\&quot;#\&quot;)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}&#10;}&#10;&#10;function MM_findObj(n, d) { //v4.01&#10;  var p,i,x;  if(!d) d=document; if((p=n.indexOf(\&quot;?\&quot;))&gt;0&amp;&amp;parent.frames.length) {&#10;    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}&#10;  if(!(x=d[n])&amp;&amp;d.all) x=d.all[n]; for (i=0;!x&amp;&amp;i&lt;d.forms.length;i++) x=d.forms[i][n];&#10;  for(i=0;!x&amp;&amp;d.layers&amp;&amp;i&lt;d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);&#10;  if(!x &amp;&amp; d.getElementById) x=d.getElementById(n); return x;&#10;}&#10;&#10;function MM_swapImage() { //v3.0&#10;  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i&lt;(a.length-2);i+=3)&#10;   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}&#10;}&#10;//--&gt;&#10;&amp;lt;/script&amp;gt;&#10;&lt;/head&gt;&#10;&#10;&lt;body onload=\&quot;MM_preloadImages(&#039;images/btn_about2.jpg&#039;,&#039;images/btn_contact2.jpg&#039;,&#039;images/btn_news2.jpg&#039;,&#039;images/btn_forum2.jpg&#039;,&#039;images/btn_home2.jpg&#039;)\&quot; style=\&quot;background-color: #000000; background-image: url(&#039;images/background_gradient.jpg&#039;)\&quot;&gt;&#10;&lt;div align=\&quot;center\&quot;&gt;&#10;  &lt;table width=\&quot;704\&quot; border=\&quot;0\&quot; cellpadding=\&quot;0\&quot; cellspacing=\&quot;0\&quot; style=\&quot;border-collapse: collapse\&quot;&gt;&#10;    &lt;!--DWLayoutTable--&gt;&#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;195\&quot; colspan=\&quot;4\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot;&gt;&#10;      &lt;img src=\&quot;images/header.jpg\&quot; width=\&quot;698\&quot; height=\&quot;195\&quot;/&gt;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td width=\&quot;350\&quot; height=\&quot;13\&quot; align=\&quot;right\&quot; valign=\&quot;middle\&quot;&gt;&lt;a href=\&quot;#\&quot; onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image2&#039;,&#039;&#039;,&#039;images/btn_about2.jpg&#039;,1)\&quot;&gt;&#10;      &lt;img src=\&quot;images/btn_about1.jpg\&quot; name=\&quot;Image2\&quot; border=\&quot;0\&quot; id=\&quot;Image2\&quot; width=\&quot;264\&quot; height=\&quot;13\&quot;/&gt;&lt;/a&gt;&lt;a href=\&quot;#\&quot; onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image3&#039;,&#039;&#039;,&#039;images/btn_contact2.jpg&#039;,1)\&quot;&gt;&lt;/a&gt;&lt;/td&gt;&#10;    &lt;td colspan=\&quot;2\&quot; align=\&quot;left\&quot; valign=\&quot;middle\&quot;&gt;&lt;a href=\&quot;#\&quot; onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image3&#039;,&#039;&#039;,&#039;images/btn_contact2.jpg&#039;,1)\&quot;&gt;&#10;    &lt;img src=\&quot;images/btn_contact1.jpg\&quot; name=\&quot;Image3\&quot; border=\&quot;0\&quot; id=\&quot;Image3\&quot; width=\&quot;263\&quot; height=\&quot;13\&quot;/&gt;&lt;/a&gt;&lt;/td&gt;&#10;    &lt;td width=\&quot;91\&quot;&gt;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;45\&quot; colspan=\&quot;3\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot;&gt;&#10;      &lt;img src=\&quot;images/header2.jpg\&quot; width=\&quot;613\&quot; height=\&quot;45\&quot;/&gt;&lt;/td&gt;&#10;    &lt;td&gt;&amp;nbsp;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;13\&quot; align=\&quot;right\&quot; valign=\&quot;middle\&quot;&gt;&lt;a href=\&quot;#\&quot; onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image5&#039;,&#039;&#039;,&#039;images/btn_news2.jpg&#039;,1)\&quot;&gt;&#10;      &lt;img src=\&quot;images/btn_news1.jpg\&quot; name=\&quot;Image5\&quot; border=\&quot;0\&quot; id=\&quot;Image5\&quot; width=\&quot;264\&quot; height=\&quot;13\&quot;/&gt;&lt;/a&gt;&lt;/td&gt;&#10;      &lt;td colspan=\&quot;2\&quot; align=\&quot;left\&quot; valign=\&quot;middle\&quot;&gt;&lt;a href=\&quot;#\&quot; onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image6&#039;,&#039;&#039;,&#039;images/btn_forum2.jpg&#039;,1)\&quot;&gt;&#10;      &lt;img src=\&quot;images/btn_forum1.jpg\&quot; name=\&quot;Image6\&quot; border=\&quot;0\&quot; id=\&quot;Image6\&quot; width=\&quot;263\&quot; height=\&quot;13\&quot;/&gt;&lt;/a&gt;&lt;/td&gt;&#10;    &lt;td&gt;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;71\&quot; colspan=\&quot;3\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot;&gt;&#10;      &lt;img src=\&quot;images/header3.jpg\&quot; width=\&quot;312\&quot; height=\&quot;71\&quot;/&gt;&lt;a onmouseout=\&quot;MM_swapImgRestore()\&quot; onmouseover=\&quot;MM_swapImage(&#039;Image8&#039;,&#039;&#039;,&#039;images/btn_home2.jpg&#039;,1)\&quot; href=\&quot;http://www.twtcouriers.com.au\&quot;&gt;&lt;img src=\&quot;images/btn_home1.jpg\&quot; name=\&quot;Image8\&quot; border=\&quot;0\&quot; id=\&quot;Image8\&quot; width=\&quot;77\&quot; height=\&quot;71\&quot;/&gt;&lt;/a&gt;&lt;img src=\&quot;images/header4.jpg\&quot; border=\&quot;0\&quot; width=\&quot;224\&quot; height=\&quot;71\&quot;/&gt;&lt;/td&gt;&#10;    &lt;td&gt;&amp;nbsp;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td colspan=\&quot;3\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot; class=\&quot;text\&quot; style=\&quot;background-image: url(&#039;file:///C:/Documents%20and%20Settings/Jedi/My%20Documents/My%20Webs/myweb/TWT_19.jpg&#039;)\&quot;&gt;&#10;      &lt;table border=\&quot;0\&quot; cellpadding=\&quot;0\&quot; cellspacing=\&quot;0\&quot; style=\&quot;border-collapse: collapse\&quot; width=\&quot;97%\&quot; id=\&quot;AutoNumber1\&quot; height=\&quot;152\&quot;&gt;&#10;        &lt;tr&gt;&#10;          &lt;td width=\&quot;100%\&quot; height=\&quot;152\&quot; valign=\&quot;top\&quot;&gt;&lt;font color=\&quot;#3F6616\&quot;&gt;TWT &#10;          Transport Systems offer a complete interstate line haul, warehousing, &#10;          country and local distribution service, utilizing our custom-made &#10;          facilities, coupled with a diverse range of vehicles ranging from cars/utes, &#10;          vans, pan techs to semi-trailers and B-doubles with drop deck and &#10;          mezzanine trailers. &lt;br&gt;&#10;          &lt;br&gt;&#10;          Reliability and flexibility are our greatest strengths, combined with &#10;          the ability to perform outside &#039;normal&#039; operating parameters. Whether &#10;          it be a carton, pallet or full loads, our dedicated staff will explore &#10;          all available options.&lt;/font&gt;&lt;p&gt;&lt;font color=\&quot;#3F6616\&quot;&gt;TWT Transport &#10;          Systems are more than a regular freight company! We specialize in &#10;          providing professional packing solutions, courier services &amp;amp; logistics &#10;          solutions to small &amp;amp; large businesses, eBay shippers, tourists, &#10;          students and householders.&lt;br&gt;&#10;          &lt;br&gt;&#10;          Our interstate line haul depart on a daily basis from &amp;quot;4 Stennett &#10;          Road, Ingelburn&amp;quot; &#10;          offering general and express services to every metropolitan and &#10;          regional state in Australia. &lt;br&gt;&#10;          &lt;br&gt;&#10;          With our up to date computer software you are able to access proof of &#10;          deliveries &#039;proof of delivery&#039; details on-line&#039; without having to &#10;          contact our customer service personnel. Just click the &amp;quot;Client Login&amp;quot; &#10;          button above to check your shipment.&lt;/font&gt;&lt;/p&gt;&#10;          &lt;p&gt;&lt;font color=\&quot;#3F6616\&quot;&gt;Click the services button above to see what &#10;          we have to offer. &lt;/font&gt;&#10;          &lt;p&gt;&amp;nbsp;&lt;/td&gt;&#10;        &lt;/tr&gt;&#10;      &lt;/table&gt;&#10;&amp;nbsp;&lt;p&gt;&amp;nbsp;&lt;/td&gt;&#10;    &lt;td&gt;&amp;nbsp;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;58\&quot; colspan=\&quot;2\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot; class=\&quot;footer\&quot;&gt;&#10;      Copyright 2008 TWT Couriers, Inc&lt;/td&gt;&#10;    &lt;td width=\&quot;28\&quot; align=\&quot;left\&quot; valign=\&quot;top\&quot;&gt;&#10;    &lt;img src=\&quot;images/footer_btn_top.jpg\&quot; border=\&quot;0\&quot; usemap=\&quot;#Map\&quot; width=\&quot;28\&quot; height=\&quot;37\&quot;/&gt;&lt;/td&gt;&#10;    &lt;td&gt;&amp;nbsp;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;    &lt;tr&gt;&#10;      &lt;td height=\&quot;0\&quot;&gt;&lt;/td&gt;&#10;      &lt;td width=\&quot;235\&quot;&gt;&lt;/td&gt;&#10;      &lt;td&gt;&lt;/td&gt;&#10;      &lt;td&gt;&lt;/td&gt;&#10;    &lt;/tr&gt;&#10;  &lt;/table&gt;&#10;&lt;/div&gt;&#10;&#10;&lt;map name=\&quot;Map\&quot; id=\&quot;Map\&quot;&gt;&#10;&lt;area shape=\&quot;circle\&quot; coords=\&quot;12,20,9\&quot; href=\&quot;#\&quot; alt=\&quot;[ Go Up ]\&quot;/&gt;&#10;&lt;/map&gt;&lt;/body&gt;&#10;&lt;/html&gt;</code>'
?>

webwiz posted this at 20:56 — 4th December 2007.

He has: 629 posts

Joined: May 2007

What a lovely example of why CSS layouts are so much better than table based designs! If you have the latest version of DW, I believe it is relatively easy to convert from tables. Perhaps someone with the latest DW can advise?

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

DSSR posted this at 09:56 — 5th December 2007.

They have: 166 posts

Joined: Mar 2006

webwiz;226983 wrote: What a lovely example of why CSS layouts are so much better than table based designs! If you have the latest version of DW, I believe it is relatively easy to convert from tables. Perhaps someone with the latest DW can advise?

Hi, yes I have DW, soemwhere on disk, I'll look up this term in google. TYVM.

demonhale wrote:

It would be best if you have the sample template up online so it's easier to see the manipulation together with the cut images...

My host has been down for a coupel days, I will try and do that for you.

Good to see you again to, demonhale

demonhale posted this at 05:04 — 5th December 2007.

He has: 3,278 posts

Joined: May 2005

It would be best if you have the sample template up online so it's easier to see the manipulation together with the cut images...

demonhale posted this at 03:58 — 6th December 2007.

He has: 3,278 posts

Joined: May 2005

Thanks DSSR, I think you can easily resolve this problem if we have the example page...

DSSR posted this at 14:39 — 6th December 2007.

They have: 166 posts

Joined: Mar 2006

Finally got it upped here : http://twtcouriers.only-the-truth.com

TYVM demon ; )

demonhale posted this at 05:58 — 7th December 2007.

He has: 3,278 posts

Joined: May 2005

Would a completely new css div solution be out of the question, it is rough to get these aligne with all the cut images... However, recoding this in css can allow you to have a three column flexible layout...

DSSR posted this at 18:08 — 7th December 2007.

They have: 166 posts

Joined: Mar 2006

I know, thats why I needed help, even teh guy that made it cannot do it correctly without getting teh middle areas to stop moving. He got the tab les in left and right, but the whole thing moves together if I try to move the left and roght tables. Exactly what I dont want.

css div? Could you explain a little where I put that? You know me, I don't know much :D>..

Cheers.

demonhale posted this at 05:03 — 8th December 2007.

He has: 3,278 posts

Joined: May 2005

Okay, when I free up on monday, I'll try to show you a rough draft of a table and div versions, but you need to align it for yourself. Talk to you later...

DSSR posted this at 11:14 — 8th December 2007.

They have: 166 posts

Joined: Mar 2006

demonhale;227118 wrote: Okay, when I free up on monday, I'll try to show you a rough draft of a table and div versions, but you need to align it for yourself. Talk to you later...

That's the problam. I can't align them. I have the table already. The designer made it, but he can't align it either.

demonhale posted this at 06:43 — 9th December 2007.

He has: 3,278 posts

Joined: May 2005

I mean the images will align, but the middle area needs some tinkering up first..., it will still look the same as before with the extra left and right columns but needs some readjusting because it consumes too much time to align and realign and to test in all browsers....

DSSR posted this at 11:48 — 9th December 2007.

They have: 166 posts

Joined: Mar 2006

What if I remake teh psd template, could you make a html file out of it? Ill slice it up and that.