when i define a container to have 2 columns, but when i type text inside the container, the width will increase.
the result is that two container both have 2 columns width, due to the text inside, they end up with different width and that caused alignment issue.
how to fix the width for both containers?

The problem is that you add un-wrappable text that is wider than the column. How would you like to have that handled, functionally?

If you just want to wrap, regardless of whether it's wrappable, use word-wrap:break-word.

Thanks for replying, i found a way around it, rather than define the width using columns, i defined it as px. Now the width are consistant and the text will wrap itself.

What type of data are you capturing in these fields?