Несколько заковырок с сайтом

[lego904]

Работаю над одним проектом: Розма

Есть несколько мелочей, которые не могу решить.

1. Два бирюзовых блока в хедере "прикрывают" фон, который просачивается в связи с тем, что сам хедер по ширине 80%.

При ресайзе окна правый бирюзовый блок создает разрыв между правой границей браузера и телом сайта.

Подскажите, как решить этот трабл.

2.Зеленая плашка, выделяющая выбранный русский язык сайта вписана как фон под элемент списка "Рус" только благодаря падингам "на глаз".

Это вызывает различные баги в IE, Opera. Chrome вроде нормально реагирует и масштабирует.

3.Пункт меню "всегда на связи" должен быть оформлен как показано на рисунке красной плашкой

Как лучше это сделать?

[wildhind]

1) не только правый, левый тоже. У хэдера ширина 80%. В случае, когда ширина внешнего блока: к примеру, 1664px, у хэдера должна быть ширина 1331px, но у него ещё есть свойство max-width:1300px. и вот эту разницу вы и видите.

2) а зачем? есть же border-radius.

3) свойствами background, padding и border-radius.

[mrnobody]

B еще наверное нужно свойство transform, т.к. виден небольшой наклон рамки.

[wildhind]

а ещё лучше не строить из себя крутых верстальщиков, а забубенить картинку, вес которой будет меньше веса css, описывающего всю эту красоту.

[lego904]

Вот картинку то я как раз и хочу забубенить, вот только хочется увидеть пример оптимального кода для этого случая.

[USF]

берете картинку в png, делаете блочный элемент по размеру картинки и задаете ему фоном картинку. это не та задача, где нужно особо много гадать на оптимальностью, каждый кодит как хочет