Question

I recently start to learn CSS and table less design.
After reviewing some tutorials now I am involved with converting PSD Mockup to XHTML and CSS.
Most often my problem is to positioning elements and containers.
for example this below design:

I am converting this to CSS and HTML.
I have no problem with styling Input elements.
about main layout it seems two columns layout , right ?
How do I style containers ?
I wrote this code It displays better here.
I divided my page to two containers and valued (float:left) to left container.
As specified in jsFiddle link elements on the left side container had come out of the box (I think its because of float).
I can’t set containers position to absolute.

Now please help me to refactor and change my code.
And please explain to me how to position elements right ?

Answer 1

i think a

<div style="clear:both;"></div>

before the </div> of the container will work.

edit:
http://jsfiddle.net/xNwAc/5/