Why does my UI lose formatting when run in-browser vs run on my computer (Java Swing)?

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:

But when I got to submit it online, where it runs in browser, the UI gets severely demented, returning back to default:

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:

this.setLayout(new GridBagLayout());

And and the components to each by:

//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);
        }

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.

--EDIT--

Alright I've done a bit of playing around based on @ MadProgrammer's suggestions. I think I've kind of narr