Как задать разных background-size?

Question

[Ольга Ветер]

Для секции задается два фона, наподобие

background: url(1.png) top right repeat,
url(2.png) center no-repeat;

Есть ли способ для каждого из них задать свой background-size?

Например, применяя background-size: contain; второй как нужно масштабируется, а первый перестает повторяться и ведет себя... как полный contain.

Answer 1

[Андрей Никифоров]

Гуглиться же легко
jsfiddle.net/tpmD4/6

Comments

[Ольга Ветер]

спасибо. как-то не получилось гуглом вопрос решить ночью.

Answer 2

[Ankhena]

background-size указывается через слеш / после других параметров к каждому из фонов.
Либо отдельной строчкой через запятую в соответствующем порядке.

background: url(1.png) top right repeat / contain, 
url(2.png) center no-repeat / cover;

Comments

[Ольга Ветер]

спасибо!

[Григорий]

почему то не работает вообще

.main{
background: url("../img/main_fon.svg") no-repeat / cover,
url("../img/fon_hc.jpg") / contain;

}

[Ankhena]

gtomilin, bg position забыли

[Григорий]

Ankhena, а что там указывать? =)

[Ankhena]

gtomilin, я никогда не видела ваш макет. Посмотрите в него самостоятельно и напишите нужные значения.

[Григорий]

Ankhena, ок:)

[Ankhena]

gtomilin, не, можно и от балды поставить вначале center и потом, по результату поменять на то, что больше походит.