Как настроить фоновое изображение при повторной настройке браузера

Question

Вот сайт: http://designobvio.us/portfolio/body.html

Я пробовал css3,% base. Невозможно изменить размер фонового изображения при изменении размера браузера

Я пытаюсь имитировать этот макет: http://www.googlezeitgeist.com/en/top-searches/rebecca_black

HTML:

<section class="bodySection">
<div id="body-wrapper" class="class="">
    <div id="me"></div>
    <div id="pattern"></div>
</div>
<div class="clearfix"></div>
</section><!--end of bodySection-->

CSS

html, body, #body-wrapper, .bodySection {height: 100%;}
#body-wrapper{
position: relative;
width:43%;
height: 100%;
}
#body-wrapper #me{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: url('http://designobvio.us/portfolio/img/Me.jpg') repeat-y;
z-index: 1;
-o-background-size:99% auto;
-webkit-background-size:100% auto;
-moz-background-size:99% auto;
background-size:100% auto;
    -webkit-transition: all 0.20s ease-out;
    -moz-transition: all 0.20s ease-out;
    -o-transition: all 0.20s ease-out;
    transition: all 0.20s ease-out;
}
#body-wrapper #pattern{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: url('http://designobvio.us/portfolio/img/sliderBG.png') repeat; 
z-index: 2;
}

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

Спасибо за ваше время! Если вам что-то нужно больше всего, просто спросите

Answer 1

Вы вызываете min-width и min-height на своем теле. Избавьтесь от них, и это прекрасно работает.

РЕДАКТИРОВАТЬ: и вам не нужно свойство перехода, изменение размера происходит свободно самостоятельно. И будьте последовательны! Или вы делаете фоновое изображение для всех браузеров 100% или для всех 99%. Это сэкономит вам много времени в будущем, когда есть небольшая разница, и вы не можете найти, где она находится.

Answer 2

Попробуйте:

background-size: cover;