aligning to div's next to each other - media query - css

Question

I am trying to render a section of my pafe as in this following image. http://i.imgur.com/63q9Syr.jpg> I can now get it to render right in larger screens. But when I use meduia query the second box mis aligns. I appears to be a little above first box. Is there way I can fix it?
<section class="carousel price-carousel"> <!--Price section -->
<div class="container">
<div class="price-container">
<span class="month-column">
<h4>Monthly</h4>
<p>$9.95</p>
<p class=”sub-text”>per computer</p>
</span>
<span class="year-column">
<h4>Yearly</h4>
<p>$99</p>
<p class=”sub-text”>Save 20% when you pay anually</p>
</span>
</div>
</div>
</section>
Any help is much appreciated.
JSFiddle link: http://jsfiddle.net/d4gyo5s8/7/

Answer 1

Just delete:
margin-top:35px;
of set it to 0, in your media-query.
Also add:
vertical-align: top;
Proof:
http://jsfiddle.net/zmqoz7pv/1/

Answer 2

I've created a sample, check the below code and the fiddle sample!!
The HTML:
<section class="carousel price-carousel">
<div class="container">
<div class="price-container">
<span class="month-column">
<h2>Monthly</h2>
<h3>$9.95</h3>
<p class="sub-text">per computer</p>
</span>
<span class="year-column">
<h2>Yearly</h2>
<h3>$99</h3>
<p class="sub-text highlight">Save 20% when you pay anually</p>
</span>
</div>
</div>
</section>
The CSS
*, ht, h2, h3, h4, p, div, img {
margin:0;
padding:0;
}
.container {
background-color: #eee;
}
.price-container {
text-align:center;
vertical-align:top;
font-family:arial;
font-size:14px;
color:#333333;
}
.price-container span {
display:inline-block;
margin:10px;
padding-bottom:10px;
border:1px solid #676767;
width:300px;
background:#fafafa;
}
.price-container h2 {
font-size:18px;
font-weight:bold;
color:#f1f1f1;
background:#676767;
padding:5px 0;
}
.price-container h3 {
font-family:'Arial Black', Helvetica, Verdana, sans-serif;
font-size:30px;
font-weight:bold;
color:#000000;
padding:8px 0;
}
.sub-text {
font-family:arial;
font-size:16px;
}
.highlight {
color:#609347;
}
Fiddle Demo