title: Why does my UI lose formatting when run in-browser vs run on my computer (Java Swing)?
body: <p>For my CSE 205 (Java programming 2) class, we have to design a really simple GUI applet. I'm pretty familiar with Swing, having used it for a few of my own projects before hand. I've designed the program with few problems, and it looks perfect on my computer when run from Eclipse:</p>
  
  <p><img src="https://i.stack.imgur.com/Bkibj.png" alt="enter image description here"></p>
  
  <p>But when I got to submit it online, where it runs in browser, the UI gets severely demented, returning back to default:</p>
  
  <p><img src="https://i.stack.imgur.com/YaAx9.png" alt="enter image description here"></p>
  
  <p>I've grown accustomed to using the GridBagLayout due to it's simplicity. That's what I am using here. The classes CreatePanel and SelectPanel (as seen in the first image) both extend JPanel (as per my professor). I set each using:</p>
  
  <pre><code>this.setLayout(new GridBagLayout());
  </code></pre>
  
  <p>And and the components to each by:</p>
  
  <pre><code>//Call the method addItem() to add the create button to the panel
  addItem(this, createB,0,2,2,1,defaultInset,GridBagConstraints.CENTER);
  
  
  
   //-------
      public void addItem(JPanel p, JComponent c, int x, int y, int width, int height, int[] inset, int align)
        {
              GridBagConstraints gc = new GridBagConstraints();
              gc.gridx = x;
              gc.gridy = y;
              gc.gridwidth = width;
              gc.gridheight = height;
              gc.weightx = 0;
              gc.weighty = 0;
              gc.insets = new Insets(inset[0],inset[1],inset[2],inset[3]);
              gc.anchor = align;
              gc.fill = GridBagConstraints.NONE;
              p.add(c, gc);
          }
  </code></pre>
  
  <p>Anyone have any ideas of what might be going on? Considering over half my time was spent getting the layouts looking right, I'd love a simple fix. I can post more code if needed. Thanks for any suggestions.</p>
  
  <p>--EDIT--</p>
  
  <p>Alright I've done a bit of playing around based on @ MadProgrammer's suggestions. I think I've kind of narrowed down where the problem is.</p>
  
  <p>This is the code I am using to set the size of the JTextField to the right of the label "Enter a Pet Type:</p>
  
  <pre><code>petTypeTF = new JTextField("");
  petTypeTF.setPreferredSize(new Dimension(125, 60));
  </code></pre>
  
  <p>Now if I change the code to anything else, like setting the number of columns:</p>
  
  <pre><code>petTypeTF = new JTextField("",12);
   petTypeTF.setPreferredSize(new Dimension(125, 60));
  </code></pre>
  
  <p>I get a UI that looks identical to the one when I submit it online. Something to do with setting the number of columns seems to be screwing it up. Does this help narrow it down for anyone?</p>