My goal is to set the width of my HTML banner to 915px. Despite having specified 915px in the .box-row, the banner's size ends up being 938px for some unknown reason.
Additionally, I'm curious about how I can manage the height of the HTML banner as well.
Jsfiddle: http://jsfiddle.net/tKn9f/5/
<div class="box-row">
<div class="box-form-body">
<h3>
See What You're Missing</h3>
</div>
<div class="box-form-button">
<img alt="Learn More" height="100" src="http://www.robindelillo.fr/img/home/seeMoreButton.png" width="100" />
</div>
.box-row {
width:915px;
padding:10px;
border:1px solid #e2e3e4;
margin-top:50px;
overflow: hidden;
background-color:#f66511;
}
.box-row h3 {
font-family:SegoeBold, Helvetica, Arial;
font-size:1.3em;
font-weight:normal;
color:#fff;
margin: 0;
}
.box-form-body {
display: inline-block;
vertical-align: middle;
width: 75%;
padding: 0 0 0 2em;
}
.box-form-button {
display: inline-block;
vertical-align: middle;
width: 15%;
padding: 0 0 0 2em;
}
.box-form-button img {
vertical-align: bottom;
}