Имеется вот такая картинка

Как сделать чтоб при разныхх разрешениях фон отображался должным образом?

Строго говоря - никак.

Можно нарезать картинку на 2-4 части по линиям, через центр градиента. Тогда в принципе, можно накладывать картинки друг на друга, так, чтобы они "вкладывались". Однако, при больших изменениях размера - будет заметно. Можно "нарастить" картинку в центре "крестом" и по краям - сплошными линиями, тогда будет побольше свободы изменений, но тоже не фонтан...

Забавный (но рабочий) способ сделать градиентный фон - транспарентная флешка как фоновое изображение...

Я бы вот так сделала:


И дорисовала бы картинку, чтобы снизу был такой же полный круг, как и слева.

Круто

Приписал background-attachment: fixed;
стало еще круче

А можно через JS определять разрешение экрана и варировать размер картинки в зависимости от оного =)