Anchoring - Make two components take up half of panel each

Question

What I have:

I have a panel (the white space), and two DataGridViews represented by the green and blue squares. The panel is anchored to take up most of the center of my screen, and grows/shrinks with the window size.

What I need:

I would like the green square to always stay with it's right border in the middle of the screen and take up the left half of the screen. Equally, I'd like the blue square to stay with its left border in the middle and to take up the right half of the screen.

Basically, I just want it to always look like this image regardless.

Do I need to do this programmaticly? I can't seem to find a combination of anchoring or docking that makes this happen, and adding more panels as containers yields the same issue in the end.

Answer 1

Not sure if this is what you want:

1. Creating a SplitContainer on the screen.

   Anchor = Top, Bottom, Left, Right
   IsSplitterFixed = True (Trick)
   

2. Creating another two datagridviews, each a side inside the SplitterContainer

   Dock = Fill
   

Answer 2

I generally use a TableLayoutPanel to accomplish this. It is very easy to use (a simple introduction can be found here).

You create to cells in the first row and set it to 50% width each. In each cell you put one DataGrid and you set their Dock'ing to Fill.