Please take a look at the preview of my pricing table code below. You'll notice that the 2nd and 3rd columns are not aligned properly. I need help fixing the code to ensure all 3 columns are level.
Check out the codes below:
<html>
<head>
<style>
@import url(http://fonts.googleapis.com/css?family=Ubuntu);
* {
margin: 0;
padding: 0;
}
body {
font-family: Ubuntu, arial, verdana;
}
.pricing_table {
line-height: 150%;
font-size: 12px;
margin: 0 auto;
width: 500%;
max-width: 800px;
padding-top: 10px;
margin-top: 100px;
}
.price_block {
text-align: center;
width: 100%;
color: #fff;
float: left;
list-style-type: none;
transition: all 0.25s;
position: relative;
box-sizing: border-box;
margin-bottom: 10px;
border-bottom: 1px solid transparent;
}
.pricing_table h3 {
text-transform: uppercase;
color: #fff;
padding: 5px 0;
background: #A6DA18;
margin: -10px 0 1px 0;
}
.price {
display: table;
background: #444;
float: center;
...