What is the best way to organize a simple interface?

Question

User interface

Given:
- textarea, into which the user enters html code
- textarea, into which the user enters css code
On submit, we get:
- Initial fields (for repeated manipulations) + processing
result and conveniently copyable (we display an additional textarea with the result). The result of processing two source fields is placed in the end in one field.
According to the interface:
- we focus on all resolutions (even 1024x768)
- 200px from the top is the menu, breadcrumbs and other small fields
- 300px on the right - sidebar
- in theory, you can refuse the sidebar, but, preferably, leave it
I would be grateful for the reasoned answers, because I myself can bring conjectures without specifics.

Answer 1

Break the entire visible area into sectors, as in jsfiddle.net, and be sure to allow the user to resize the sectors. You can also hide the sidebar. There is a cool plugin for jQuery - jQuery UI.Layout . It will allow you to cover all screen resolutions (it will fill the entire visible area), move sector boundaries, hide certain blocks, etc. Here is one example .

Answer 2

>>— we focus on all resolutions (even 1024x768)
“Even” in which direction? What about netbook 1024x600 and mobile formats?