Расширение при помощи background-size:cover;

[BSandro]

Вот такая проблема, не могу некак решить уже часа 3 мучаюсь надежда тока на вас

К сожелению саму картинку показать не могу, постораюсь обьяснить на словах

 

 

 

 

У нас есть фон для меню шириной 1200px и высотой в 88px

 

а щас вот сам код

.top {	background:url(images/bg_top.png) no-repeat;	background-size:cover;	max-width:1200px;	height:88px;	display:block;	margin:0 auto;}

то есть при разрешений больше 1200px все нормально картинка стоит по центру

 

при смене разрешения в 1024 на 768 картинка режется и правый скругленный угол не видно

тоже самое при разрешеий 800*600 но еще в добавок появляется scroll

 

Как решить эту проблему , вообще перепробовал много способов но не получается...

 

 

Вся надежда на вас (

Edited November 10, 2013 by BSandro

[npofopr]

Может надо background-size: 100% auto; сделать? 

И есть такой сервис, как http://jsfiddle.net куда можно выложить свой код.

[BSandro]

Может надо background-size: 100% auto; сделать? 

И есть такой сервис, как http://jsfiddle.net куда можно выложить свой код.

знаю, забыл извеняюсь.

 

Высота начинает сужатся.

пробывал все это.

 

вот даже пример http://jsfiddle.net/3sSV4/

Edited November 10, 2013 by BSandro

[npofopr]

Ужас. Что вы творите :-) 

1. Ваш фон можно сделать с помощью css3

2. Ваш фон можно сделать с помощью 1px картинки в длину с repeat: repeat-x;

[BSandro]

Ужас. Что вы творите :-) 

1. Ваш фон можно сделать с помощью css3

2. Ваш фон можно сделать с помощью 1px картинки в длину с repeat: repeat-x;

а там другие элементы не видно?

была бы там 1 чистый градиент  и тень я бы так и сделал...

[npofopr]

Примерно так http://jsfiddle.net/npofopr/3sSV4/2/

 

Ужас. Что вы творите :-) 

1. Ваш фон можно сделать с помощью css3

2. Ваш фон можно сделать с помощью 1px картинки в длину с repeat: repeat-x;

а там другие элементы не видно?

была бы там 1 чистый градиент  и тень я бы так и сделал...

 

нет. не видно

[BSandro]

мм спасибо большое