Vertically centering button using css
http://jsfiddle.net/8v8gLn4y/
.container {
background: lightblue;
display: table;
width:100%;
}
input[type=button] {
display: block;
width: 50%;
margin: 0 auto;
}
.button-wrapper {
background: darkorange;
display: table-cell;
vertical-align: middle;
}
<div class='container'>
<div>some line with text</div>
<div>another line with text</div>
<div class='button-wrapper'>
<input type="button" value="submit" />
</div>
</div>
update 2016:
flexbox
.container {
background: bisque;
display: flex;
width: 100%;
}
.container>div {
flex-grow: 1;
}
.button-wrapper {
background: chocolate;
display: flex;
flex-direction: column;
justify-content: center;
}
input[type=button] {
display: block;
width: 50%;
margin: 0 auto;
flex-shrink: 1;
}
<div class='container'>
<div>
<p>some line with text</p>
<p>another line with text</p>
</div>
<div class='button-wrapper'>
<input type="button" value="submit" />
</div>
</div>