Should i put my table in my external style sheet?

Question

Should i put my table in my external style sheet? if so how do i do this?
i'm having serious problems trying to stop my menu bar and header to stop jumping around when a switch pages. I realised i needed to create an external style sheet. however, when i extracted the ccs styles from my one of my pages (my homepage), there is only styles for my spry menu bar, nothing else. - however this doesnt stop my menu bar from moving around. all of my pages are use tables. so my menu bar and header are both 'td' rather than in a div or wrapper.
it seems as though nothing i try will stop my items from moving around. they are all exactly the same width and height in html and the same in css. I know about attaching style sheets, but i just cant seem to understand how to get everything aligned properly. I want my external style sheet to have my header at the top and centre, and my menu bar underneath and centre. How do i do this using a table? do i put the table into the external style sheet so that my table measurements etc are the same for each page? + how do i do this? Does anything else other than positions, colours, fonts etc go into my external style sheet? cos im aware that i use the html for the things i want to look different and every page, and the css for the things that i want to look the same. so which stuff goes in which? im getting really confused now, does my header and menu bar need to go in my external style as well as my html? :S
everything just seems to have gone horribly wrong, ive tried so many things, but everything i try simply has no effect. blahhh :/

Answer 1

and this is the external style sheet, which i extracted from my home page (the top code). what do i need to add to this?
@charset "utf-8";
body {
                    margin: 0px;
          border-left-style: none;
          border-left-color: #CCC;
          border-bottom-color: #FFF;
          border-bottom-width: 25px;
          border-bottom-style: solid;
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          cursor: default;
          width: 640px;
          margin-bottom: 0;
          margin-left: auto;
          border-top-style: none;
          border-right-style: none;
          border-bottom-style: none;
          border-left-style: none;
          border-top-color: #000;
          border-right-color: #000;
          border-bottom-color: #000;
          border-left-color: #000;
          margin-right: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
          z-index: 1000;
#header {
          clip: rect(auto,auto,auto,auto);
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          position: relative;
          text-align: left;
          cursor: pointer;
          width: 8em;
          float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
          margin: 0;
          padding: 0;
          list-style-type: none;
          font-size: 100%;
          z-index: 1020;
          cursor: default;
          width: 278px;
          position: absolute;
          left: -1000em;
          height: 48px;
          top: 55px;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
          border: 1px solid #CCC;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
          left: 1px;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
          width: 8.7em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
          position: absolute;
          margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
          left: -269px;
          top: 5px;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
          display: block;
          cursor: pointer;
          background-color: #FFF;
          padding: 0.5em 0.75em;
          color: #000;
          text-decoration: none;
          font-family: Pristina;
          font-size: 21px;
          text-align: center;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
          background-color: #FFF;
          color: #999;
          font-family: Pristina;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
          background-color: #FFF;
          color: #999;
          font-family: Pristina;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
          background-image: url(SpryAssets/SpryMenuBarDown.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
          background-image: url(SpryAssets/SpryMenuBarRight.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
          font-size: 21px;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
          background-image: url(SpryAssets/SpryMenuBarDownHover.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
          font-size: 21px;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
          background-image: url(SpryAssets/SpryMenuBarRightHover.gif);
          background-repeat: no-repeat;
          background-position: 95% 50%;
          font-size: 21px;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
          position: absolute;
          z-index: 1010;
          filter:alpha(opacity:0.1);
          font-size: 21px;
          ul.MenuBarHorizontal li.MenuBarItemIE
          display: inline;
          f\loat: left;
          background: #FFF;
          font-size: 21px;
body {
          margin: 0px;
          border-left-style: none;
          border-left-color: #CCC;
          border-bottom-color: #FFF;
          border-bottom-width: 25px;
          border-bottom-style: solid;