background in div is not resizing in bootstrap - html

Question

When adding a background to a div and resizing the screen the background image stays where it is and does not respond to resizing in the new smaller screen
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 style="color: #adaaad">contact</h2>
<br>
</div>
</div>
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<!-- To configure the contact form email address, go to mail/contact_me.php and update the email address in the PHP file on line 19. -->
<!-- The form should work on most web servers, but if the form is not working you may need to configure your web server differently. -->
<form name="sentMessage" id="contactForm" novalidate>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label class="aligntextright">name</label>
<input type="text" class="form-control" placeholder="name" id="name" required data-validation-required-message="name">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label class="aligntextright">email</label>
<input type="email" class="form-control" placeholder="email" id="email" required data-validation-required-message="input email">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label class="aligntextright">number</label>
<input type="tel" class="form-control" placeholder="number" id="phone" required data-validation-required-message=" input number">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label class="aligntextright">message</label>
<textarea rows="5" class="form-control" placeholder="message" id="message" required data-validation-required-message="enter message"></textarea>
<p class="help-block text-danger"></p>
</div>
</div>
<br>
<div id="success"></div>
<div class="row">
<div class="form-group col-xs-12">
<button type="submit" class="btn btn-success btn-lg">send</button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
#contact{
background: url("img/style.png") no-repeat right 0;
}

Answer 1

This Css works fine
background-size: 100% auto;