I'm facing an issue with the rightHeader text placement in my code snippet:
#rightHeader {
height: 450px;
vertical-align: middle;
display: inline-block;
}
<div id="header" class="header">
<div class="container">
<div class="row">
<div id="headerBox" class="col-md-5 text-center">
<form id="signup" action="" method="post">
<h1>text</h1>
<p>text</p>
<input id="inputField1" class="form-control" placeholder="First Name" type="text" tabindex="1" required>
<input id="inputField2" class="form-control" placeholder="Your Email" type="email" tabindex="1" required>
<input id="inputField2" class="form-control" placeholder="Password" type="email" tabindex="1" required><br>
<button class="btn btn-lg btn-primary">Join For Free</button>
</form>
</div>
<div id="rightHeader" class="col-lg-7 text-center">
<ul>
<li>text.</li>
</ul>
</div>
</div>
</div>
</div>
Trying to align the text vertically without using margin-top for the rightHeader div. Any suggestions on a better approach?
Appreciate any help. Thanks