title: Table Format Issues and Functions not working
body: <p>I programed a simple tic-tac-toe game. When the table shows up it is all squished. Is there a way to keep the table empty but not squished? Also, I'm using NotePad++ and when I try to run my program in FireFox the functions do not work. I'm not sure why, anyone know? I can get it to work in Chrome, but it needs to be able to work in FireFox. Here is my program:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;style&gt;
          .Square{
          width:60px;
          height 60px;
          text-align:center;
          font-size: 18pt;
          font-weight: bold;
          font-family: Verdana;
          }
      &lt;/style&gt;
  
          &lt;script&gt;
              function startGame()
                  {
                      for (var i = 1; i&lt;= 9; i = i + 1)
                      {
                          clearBox(i);
                      }
  
                  document.turn = "X";
                  if (Math.random()&lt; 0.5)
                  {
                      document.turn = "O";
                  }
                  document.winner = null;
                  setMessage(document.turn + " gets to start.");
              }
  
              function setMessage(msg)
              {
              document.getElementById("message").innerText = msg;
              }
  
              function nextMove(square)
              {
                  if (document.winner != null)
                  {
                      setMessage(document.winner + " Already Wone the Game!");
                  }
                  else if (square.innerText == "")
                  {
                      square.innerText = document.turn;
                      switchTurn();
                  }
                  else
                  {
                      setMessage("That Square is Already Used.")
                  }
              }
  
              function switchTurn()
              {
                  if(checkForWinner(document.turn))
                  {
                      setMessage("Contratulations " + document.turn + "! You Win!");
                      document.winner = document.turn;
                  }
                      else if (document.turn == "X")
                          {
                              document.turn ="O";
                              setMessage("It's " + document.turn + "'s turn!");
                          }
                      else
                      {
                          document.turn ="X";
                          setMessage("It's " + document.turn + "'s turn!");
                      }
              }
  
              function checkForWinner(move)
              {
                  var result = false;
                  if(checkRow(1,2,3, move) || 
                     checkRow(4,5,6, move) || 
                     checkRow(7,8,9, move) ||
                     checkRow(1,4,7, move) ||
                     checkRow(2,5,8, move) ||
                     checkRow(3,6,9, move) ||
                     checkRow(1,5,9, move) ||
                     checkRow(3,5,7, move))
                     {
                      result = true;
                     }
                      return result;
              }
  
              function checkRow(a,b,c, move)
              {
                  var result = false;
                  if (getBox(a)== move &amp;&amp; getBox(b)== move &amp;&amp; getBox(c)== move)
                  {
                  result = true;
                  }
                  return result;
              }
  
              function getBox(number)
              {
                  return document.getElementById("s" + number).innerText;
              }
  
              function clearBox(number)
              {
                  document.getElementById("s" + number).innerText = "";
              }
  
          &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body onload= "startGame();"&gt;
      &lt;h1&gt; Tic-Tac-Toe!&lt;/h1&gt;
      &lt;div id="message"&gt;message will be here &lt;/div&gt;
      &lt;table border= "1"&gt;
          &lt;tr&gt;
              &lt;td id="s1" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s2" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s3" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td id="s4" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s5" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s6" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td id="s7" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s8" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
              &lt;td id="s9" class= "Square" onclick="nextMove(this);"&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
      &lt;a href= "javascript:startGame();"&gt; Start New Game&lt;/a&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>