Thread: How can I add in a 3rd column in on the right like the one on the left ?
View Single Post
  #4 (permalink)  
Old Aug 12th, 2007, 23:02
Lchad Lchad is offline
SuperMember

SuperMember
Join Date: Sep 2006
Location: Pink House
Posts: 3,946
Thanks: 0
Thanked 0 Times in 0 Posts
Re: How can I add in a 3rd column in on the right like the one on the left ?
Hi!
Your #wrap width is 845. If you add another sidebar div to the right side, you are going to have to tweak all your widths. Are you all set doing that yourself?
Sidebar + main + sidebarright will have to = 845 pixels.

I've just copied and pasted the leftside bar div and placed it in the proper location of the code. However if you view this is will appear BELOW the main div because the widths are OVER 845 pixels.

Let me know if you need help with the div widths. But I didn't change things because you have graphics inside that are pretty wide.

Add this to your css
Code: Select all
#sidebarright {
    float: left;
    width: 280px;
    margin: 0;
    padding: 0;
    background-color: #FFFFFF;
}
Here is your html
the sidebarright div is the section in red.

Code: Select all
<body><!-- wrap starts here -->
<div id="TopCol"><img src="images/360refclick.jpg" alt="Click For Free Xbox 360" width="111" height="92" /></div>
<div id="apDiv1"><img src="images/ps3refclick.jpg" alt="Click For Free PS3" width="111" height="92" /></div>
<div id="apDiv2"><img src="images/wiirefclick.jpg" alt="Click For Free Wii" width="111" height="92" /></div>
<div id="wrap">

        <!-- header -->
        <div id="header">            
                    
          <div align="right"><span class="red red" id="slogan"> Your Guide To FREE Goodies...</span></div>
          <!-- tabs -->
            <ul id="sidebar2">

<li id="current"><a href="index.html"><span>Home</span></a></li>
                <li><a href="Proof.html"><span>The Proof</span></a></li>
              <li><a href="How.html"><span>The Guide</span></a></li>
              <li><a href="TheGoodies.html"><span>The Goodies</span></a></li>
              <li><a href="FAQ.html"><span>FAQ</span></a></li>
              <li><a href="Contact.html"><span>Contact Us</span></a></li>

              <li><a href="Links.html"><span>Links</span></a></li>            
          </ul>
  </div>
        
<div id="header-logo">            
            
            <div id="logo">Free<span class="red">Goodies</span>Guide.<span class="red">co</span>.uk</div>        
            
    <div align="right"></div>
            <p>&nbsp;</p>

  </div>
<p>&nbsp;</p>
<div id="sidebar" >
  <h1> Top<span class="red"> Freebie </span> Goodies</h1>
<div class="left-box">
              <div align="center">
                <p class="style35"><strong>Click On Which <span class="red">FREE</span> Goodies You Would Like</strong> <strong>And Sign Up !</strong></p>

                <p class="style35">Microsoft Xbox 360</p>
                <p><a href="http://360giveaway.co.uk/index.php?referral=208163" target="_blank"><img src="images/360refclick.jpg" alt="Click For Free Xbox 360" width="155" height="142" /></a></p>
                <p class="style35">Sony Playstation 3</p>
                <p><a href="http://sonyps3giveaway.co.uk/index.php?referral=438589" target="_blank"><img src="images/ps3refclick.jpg" alt="Click For Free PS3" width="155" height="136" /></a></p>
                <p class="style35">Nintendo Wii</p>
                <p><a href="http://Wii.Giveaway.co.uk/index.php?referral=417571" target="_blank"><img src="images/wiirefclick.jpg" alt="Click For Free Wii" width="155" height="136" /></a></p>
                <p class="style30"><strong>Theres More <a href="TheGoodies.html" class="red">Here</a> !</strong></p>

      </div>
    </div>
                
            
    <h1><span class="red"><span class="style10">Top</span> Freebie</span> Networks</h1>
<div class="left-box">
                <p><a href="http://gameconsolegiveaway.co.uk/index.php?referral=74003" target="_blank"><img src="images/GCNet.JPG" alt="Game Console Giveaway Network" width="251" height="70" /></a></p>
      <p><a href="http://hdtv.freebiejeebies.co.uk/?id=1151 " target="_blank"><img src="images/fjbanner.JPG" alt="FreebieJeebies" width="251" height="52" /></a></p>
      <p><a href="http://Apple.real-incentives.com/?referral=28321" target="_blank"><img src="images/AppleRInet.JPG" alt="Apple Real Incentives" width="251" height="70" /></a></p>

      <p><a href="http://www.xpango.com?ref=90601720" target="_blank"><img src="images/xpangonet.JPG" alt="Xpango Free iPhone" width="251" height="90" /></a></p>
</div>    
            
    <h1>Quick Links</h1>
            <div class="left-box">
                <p align="left" class="style35">eXceem - Forum</p>
              <p align="center"><a href="http://www.exceem.co.uk/forums/index.php?referrerid=5229"><img src="images/exceemlink.JPG" alt="Visit the eXceem Forum" width="186" height="69" /></a></p>
              <p class="style35">Grab4Free - Forum</p>
              <p align="center"><a href="http://www.grab4free.com/forums/index.php?referrerid=982" target="_blank"><img src="images/grab4freelink.JPG" alt="Grab4Free Forum" width="186" height="69" /></a></p>

    </div>        
  </div>        
        
                            
<div id="main">
  <h1>What's this free stuff all about ?</h1>
    <p><span class="style23">FreeGoodiesGuide.co.uk</span><span class="style35"> is here to help you on your way to <span class="red "><strong>FREE</strong></span> goodies    !</span></p>
          <p class="style35">Have your ever fancied a freebies such as a Free PS3, Free HDTV, Free Nintendo Wii, Free iPod and Free Xbox 360 or even the latest Xbox Elite ? </p>

          <p><span class="style38">Yes ?</span> <span class="style35">Then let's get you on your way !</span></p>
    <p align="center" class="style35">Right, so I'm pretty confident in saying that you must think this is <span class="red"><strong>SCAM</strong></span> or there must be some sort of <span class="red"><strong>CATCH</strong></span>....</p>
          <p align="center"><strong>THING IS THERE IS <span class="red style30">NONE !</span></strong></p>

          <p align="center" class="style35">Let me tell you how it works. It's Simple ! It's ALL about <span class="red"><strong>Advertising</strong></span> !</p>
          <p align="center" class="style35">The <a href="TheGoodies.html">goodies</a> that you would get for <span class="red"><strong>FREE</strong></span>  are paid for by the reward websites.</p>
          <p align="center" class="style35">The reward websites get commision when the offers are completed, that pays for the goodies ! <span class="style41">It's that <span class="red">Simple</span> !</span></p>

          <p align="center" class="style26">Sign Up -&gt; Complete An Offer - &gt; Refer Others -&gt; Receive Your Goodies</p>
    <p align="center" class="style35"><strong>Want to know more ?</strong> <strong><a href="How.html" class="red">CLICK HERE</a></strong></p>
          <table width="545" border="0">
            <tr>

              <td width="74">&nbsp;</td>
              <td width="402"><table width="366" border="0" align="center" bgcolor="#ECE9D8">
                <tr>
                  <td><p align="center" class="style28">Getting  Started</p>
                    <p align="center" class="style35">It's a Simple <strong>3 Point Step</strong></p>
                    <p align="center" class="style35"><strong>1.</strong> <a href="TheGoodies.html"><strong>Choose A Free Gift</strong></a>, Sign up and Complete Just 1 Of The Offers ( &pound;5 to &pound;10 Max )</p>

                    <div align="center" class="style35"><strong>2</strong>. Refers Friends And/Or Family To Do The Same</div>
                    <p align="center" class="style35"><strong>3</strong>. Your <span class="red"><strong>FREE</strong></span> goodies are sent to you !</p>
                    <p align="center" class="style35">You can do this as many times as you wish Per Gift site, Offer &amp; Per Household.</p></td>
                </tr>

              </table></td>
              <td width="55">&nbsp;</td>
            </tr>
          </table>
          <p align="center"><strong class="style5">Note:</strong> <span class="style35">Please make sure that you have a read of the Terms &amp; Conditions of these freebies websites, to insure that you are fully aware of the small nitty gritty details.</span> <span class="style35">The free gift sites shown on FreeGoodiesGuide are <strong>ONLY</strong> open to UK Residents.</span></p>

          <h1> free freebies like wii xbox 360 ps3 hdtv ' s received by exceem forum members</h1>
                
    <div align="center">
              <table width="536" height="461" border="0">
                <tr>
                  <td height="28" colspan="2"><div align="center" class="style35">Click To Enlarge</div></td>
                </tr>
                <tr>

                  <td width="250" height="192"><a href="images/Proofpic2.1.jpg" target="_blank"><img src="images/Proofpic2.jpg" alt="Nintendo Wii" width="256" height="212" /></a></td>
                  <td width="276"><a href="images/Proofpic4.jpg" target="_blank"><img src="images/Proofpic4.jpg" alt="FREE PS3 &amp; Xbox 360" width="256" height="212" /></a></td>
                </tr>
                <tr>
                  <td height="209"><a href="images/Proofpic1.1.jpg" target="_blank"><img src="images/Proofpic1.jpg" alt="Samsung HDTV" width="256" height="212" align="middle" /></a></td>
                  <td><a href="images/proofpic3.1.jpg" target="_blank"><img src="images/proofpic3.jpg" alt="" width="256" height="212" /></a></td>
                </tr>
          </table>
          </div>

          <h1>&nbsp;</h1>
  </div>    <div id="sidebarright" >
  <h1> Top<span class="red"> Freebie </span> Goodies</h1>
<div class="left-box">
              <div align="center">
                <p class="style35"><strong>Click On Which <span class="red">FREE</span> Goodies You Would Like</strong> <strong>And Sign Up !</strong></p>

                <p class="style35">Microsoft Xbox 360</p>
                <p><a href="http://360giveaway.co.uk/index.php?referral=208163" target="_blank"><img src="images/360refclick.jpg" alt="Click For Free Xbox 360" width="155" height="142" /></a></p>
                <p class="style35">Sony Playstation 3</p>
                <p><a href="http://sonyps3giveaway.co.uk/index.php?referral=438589" target="_blank"><img src="images/ps3refclick.jpg" alt="Click For Free PS3" width="155" height="136" /></a></p>
                <p class="style35">Nintendo Wii</p>
                <p><a href="http://Wii.Giveaway.co.uk/index.php?referral=417571" target="_blank"><img src="images/wiirefclick.jpg" alt="Click For Free Wii" width="155" height="136" /></a></p>
                <p class="style30"><strong>Theres More <a href="TheGoodies.html" class="red">Here</a> !</strong></p>

      </div>
    </div>
                
            
    <h1><span class="red"><span class="style10">Top</span> Freebie</span> Networks</h1>
<div class="left-box">
                <p><a href="http://gameconsolegiveaway.co.uk/index.php?referral=74003" target="_blank"><img src="images/GCNet.JPG" alt="Game Console Giveaway Network" width="251" height="70" /></a></p>
      <p><a href="http://hdtv.freebiejeebies.co.uk/?id=1151 " target="_blank"><img src="images/fjbanner.JPG" alt="FreebieJeebies" width="251" height="52" /></a></p>
      <p><a href="http://Apple.real-incentives.com/?referral=28321" target="_blank"><img src="images/AppleRInet.JPG" alt="Apple Real Incentives" width="251" height="70" /></a></p>

      <p><a href="http://www.xpango.com?ref=90601720" target="_blank"><img src="images/xpangonet.JPG" alt="Xpango Free iPhone" width="251" height="90" /></a></p>
</div>    
            
    <h1>Quick Links</h1>
            <div class="left-box">
                <p align="left" class="style35">eXceem - Forum</p>
              <p align="center"><a href="http://www.exceem.co.uk/forums/index.php?referrerid=5229"><img src="images/exceemlink.JPG" alt="Visit the eXceem Forum" width="186" height="69" /></a></p>
              <p class="style35">Grab4Free - Forum</p>
              <p align="center"><a href="http://www.grab4free.com/forums/index.php?referrerid=982" target="_blank"><img src="images/grab4freelink.JPG" alt="Grab4Free Forum" width="186" height="69" /></a></p>

    </div>        
  </div>        
        
<!-- wrap ends here -->
</div>
        
<!-- footer starts here -->
<div class="footer">
    
        <p>    
        &copy; 2007 FreeGoodiesGuide &nbsp;&nbsp;    
        
        
        
        
        
         
        Design by: <a href="http://www.styleshout.com/" target="_blank">styleshout</a> | 
        Valid XHTML |
       CSS <a href="Sitemap.html">Sitemap</a></p>

        <table width="1226" border="0">
          <tr>
            <td width="326" height="40">&nbsp;</td>
            <td width="560"><table width="200" border="0" align="center">
              <tr>
                <td height="36"><div align="center"><span class="style10"><a href="http://www.linkreferral.com/adwel.pl?oldrefid=110080" target="_blank"><img src="http://www.linkreferral.com/images/linkreferal/linkbutton.gif" border="0" alt="Guide on how to get free xbox 360, free PS3, free Nintendo Wii. Also freebies such as PSP and HDTV" width="114" height="32" /></a></span></div></td>
                <td><!--Begin TheFreeSite.com Coding -->
                  &nbsp;<a href="http://www.thefreesite.com" target="_blank"><img src="http://www.thefreesite.com/free88.gif" alt="The Free Site!" width="88" height="31" border="0" align="top" /></a>
                  <div align="center"></div></td>

                <td><div align="center"><span class="style10"><a href="http://www.tinycounter.com" target="_blank" title="free web counter"><img border="0" alt="free web counter" src="http://mycounter.tinycounter.com/index.php?user=nizmo" /></a></span></div></td>
                <td><div align="center"><a href="http://www.pagerank10.co.uk" target="_blank"><img src="http://www.pagerank10.co.uk/pagerank10_small.gif" border="0" alt="Improve google rankings" /></a></div></td>
                <td><div align="center"><span class="style10"><a href="http://www.freebielist.com" target="_blank"><img src="images/freebielistbutton2.gif" alt="Freebie List" width="88" height="31" /></a></span></div></td>
              </tr>
            </table></td>
            <td width="326">&nbsp;</td>
          </tr>
        </table>
        <p>&nbsp;</p>

        <p align="center" class="style14"><span class="style10"><span class="style9"><span class="style22"><a href="http://www.ukcrawler.co.uk" class="style9">UK Search Engine </a></span></span><a href="http://www.startranking.com"><span class="style9"><span class="style9">    Search Engine Optimization</span> </span></a><a href="http://www.instantlinkexchange.com" class="style9">Reciprocal Link Exchange</a>
  
  
  <a href="http://www.whiterankers.com" class="style9">Advertise Your Website Free</a>&nbsp;<a href="http://www.freespider.com" target="_top" class="style9">FreeSpider</a> <a href="http://www.submitexpress.com/" class="style9">Search Engine Marketing and SEO Tools</a></p>
</div>    
</body>
</html>
Reply With Quote