how to set image into div - html

Question

I am trying to fit a image into div but something going wrong, actualy i just want when i set a image into div it should not affect the div property.
i am trying like this:
#image_try {
background-color: white;
-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5);
-webkit-border-radius: 12px;
-moz-border-radius: 7px;
border-radius: 7px;
background: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, white), color-stop(15%, white), color-stop(100%, #D7E9F5));
background: -moz-linear-gradient(top, white 0%, white 55%, #D5E4F3 130%);
float: right;
border: 2px;
color: #FF0000;
overflow: hidden;
width: 164px;
display: table;
margin: 0 auto;
padding: 78px 31px 7px 233px;
background: #FFFFFF;
height: 79px;
margin-top: -174px;
margin-right: 25px;
background-image:url(images/weather.jpg) no-repeat;
}
updates:
Actualy when i did not set image in background then div looks like good but when i am setting image its height and width being affected
any idea... answer will be fully appreciate...thank you

Answer 1

I can see few dupe in your css like for background, you using color twice also you are setting it to gradient for Chrome and Firefox. You are repeating margin too. As far as i can under stand your problem was with padding. I removed that only. Kindly check the css and provide screenshot if possible.
#image_try {
-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5);
-webkit-border-radius: 12px;
-moz-border-radius: 7px;
border-radius: 7px;
border: 2px;
color: #FF0000;
width: 164px;
height: 79px;
background-image:url(images/weather.jpg) no-repeat;
}
Try above edited answer