my fluid grid div tag won't resize properly

Running DW CS6, when creating a fluid grid layout with 12 grid columns, I find that when i insert a new fluid grid div tag (start new line) then the div extends across all 12 columns. So far so good. However, when I create two new fluid grid div tags (both NOT start new line) and then try and resize them, they do not resize properly.

Lets say that I resize the first one to 4 columns wide, and then resize the second one to 8 columns wide, according to the tutorials they should both end up on the same line and cover the entire 12 grid columns. However, what is happening is the second 8-column wide one in fact moves down to the next row underneath the previous 4-column wide div. The only way to keep them on the same line is to reduce one of them in width by one grid column size, so only 11 grid columns are covered. This obviously is not acceptable for the layout.

What am I doing wrong and how do I correct this? Thx. John