vForums Support > Programming & Coding :: Code Requests & Support :: > Side Table at Same Level as Banner.

Side Table at Same Level as Banner. - Posted By Fel!x (felix) on 5th Oct 09 at 10:23am
Okay, I'm thinking this is going to be quite simple because it's commonplace on many websites, but I was wondering how you can make the normal side table begin at the same place as the banner. By that I mean something like this:
Image

Thank you very much in advance. :]

Re: Side Table at Same Level as Banner. - Posted By dog199200 (dog199200) on 5th Oct 09 at 4:42pm
want to try to do this one on your own or want to to do it for you, its very very easy, just got to merge two codes that will take like 30 seconds, no coding experience required:


Floating Menu ~ Global Header
Code:
 
  1. <style>
  2. body {
  3.     margin-top: 20px;
  4. }
  5. </style>
  6. <table width="100%" border="0" style="position: fixed; left: 0px; top: -4px">
  7.     <tr>
  8.         <td align="center">
  9.             <table cellspacing="1" cellpadding="3" class="border" border="0" width="95%">
  10.                 <tr>
  11.                     <td class="title1" id='new_menu'></td>
  12.                 </tr>
  13.             </table>
  14.         </td>
  15.     </tr>
  16. </table>
  17. <script>
  18. /*Floating Menu
  19. Created By Wrighty
  20. Do Not: Rip, Repost or Claim*/
  21. get('new_menu','id').appendChild(get('menu_buttons','id').getElementsByTagName('font')[0]);
  22. get('menu_buttons','id').parentNode.style.display = 'none';
  23. </script>
 


Left Side Tables ~ Global Header
Code:
 
  1. <table border="0" cellpadding="3" cellspacing="4" style="margin-top: -30px">
  2. <tr>
  3. <td width="300px" valign="top">
  4. <table border="0" cellpadding="3" cellspacing="1" class="border" width="100%">
  5. <tr>
  6. <td class="title2">
  7. Title Here
  8. </td>
  9. </tr>
  10. <tr>
  11. <td class="window1">
  12. Content HERE!
  13. </td></tr></table>
  14. <br /><br />
  15. </td>
  16. <td align="right" valign="top">
 


Left Side Tables ~ Global Footer
Code:
 
  1. </td>
  2. </tr>
  3. </table>
  4.  
 


*Hint, Remove the JS script from floating the menu and change the id's in the table and it will work fine {Tongue Out}

If you can't do that let me know and i'kll do it, I got nothing better to do.

Re: Side Table at Same Level as Banner. - Posted By Fel!x (felix) on 6th Oct 09 at 7:51am
I'd have no idea how to do that, I'm not very code-savvy, sorry. If you wouldn't mind that would be wonderful, thank you. :]

Re: Side Table at Same Level as Banner. - Posted By dog199200 (dog199200) on 7th Oct 09 at 5:23am
{Tongue Out} well ok here it is {Tongue Out}

Side Tables ~ Global Header
Code:
 
  1. <style>
  2. body {
  3.     margin-top: 20px;
  4. }
  5. </style>
  6. <table width="100%" border="0" style="position: fixed; left: 0px; top: -4px">
  7. <tr>
  8. <td align="center">
  9.  
  10.  
  11. <table cellspacing="1" cellpadding="3" class="border" border="0" width="95%">
  12. <tr>
  13. <td class="title2">
  14. Table 1 Title
  15. </td>
  16. </tr>
  17. <tr>
  18. <td class="window1">
  19. Table 1 Content
  20. </td></tr></table>
  21.  
  22.  
  23. <br /><br />
  24.  
  25.  
  26. <table cellspacing="1" cellpadding="3" class="border" border="0" width="95%">
  27. <tr>
  28. <td class="title2">
  29. Table 2 Title
  30. </td>
  31. </tr>
  32. <tr>
  33. <td class="window1">
  34. Table 2 Content
  35. </td></tr></table>
  36.  
  37.  
  38. </td>
  39. <td align="right" valign="top">
 



Side Tables ~ Global Footer
Code:
 
  1. </td>
  2. </tr>
  3. </table>
  4.  
 


you'll have to adjust the margin to make it the right height though, but thats easy

Re: Side Table at Same Level as Banner. - Posted By Fel!x (felix) on 7th Oct 09 at 6:56am
That didn't work, it just made everything float in front of the banner...
http://wevefoundthem.vforums.co.uk/
:/

Re: Side Table at Same Level as Banner. - Posted By dog199200 (dog199200) on 7th Oct 09 at 7:14pm
hmm... try this:

Code:
 
  1. <style>
  2. body {
  3.     margin-top: 20px;
  4. }
  5. </style>
  6. <table class="border" width="10%" cellpadding="4" cellspacing="1" style="position: fixed; left: 25px; top: 4px">
  7. <tr>
  8. <td class="title2" align="center" width="100%">
  9.  
  10.  
  11. Title 1
  12.  
  13. </td>
  14. </tr>
  15. <tr>
  16. <td class="window1" align="center">
  17.  
  18. Content 1
  19.  
  20. </td>
  21. </tr>
  22.  
  23.  
  24. <tr>
  25. <td class="title2" align="center" width="100%">
  26.  
  27. Title 2
  28.  
  29. </tr>
  30. <tr>
  31. <td class="window1" align="center">
  32.  
  33.  
  34. Content 2
  35.  
  36.  
  37. </font>
  38. </td>
  39. </tr>
  40. </table>
 


all of it goes in the global header