Columns underneath each other Bootstrap - php

Question

I have been having real trouble getting columns in the right order on my site. I'd like the red box (under the sign in box) to be another panel for news. But i cant work out how to do this any ideas.
https://www.dropbox.com/s/vgwhpurwo15gvet/Capture.PNG?dl=0
<div class="container">
<div class="col-lg-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Sign In</h3>
<div style="float:right; font-size: 80%; position: relative; top:-10px">Forgot password?</div>
</div>
<div class="panel-body">
<form action="index.php" method="post">
<div class="form-group">
<label for="username">Username</label>
<input type="text" name="username" class="form-control" placeholder="Username" id="username" value="<?php echo $submitted_username; ?>" />
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" placeholder="Password" name="password" value="">
</div>
<input type="submit" class="btn btn-success" value="Login" />
<span>
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#missionmodal">
Read Me!</button>
<!-- Modal -->
<div class="modal fade" id="missionmodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Our Mission</h4>
</div>
<div class="modal-body">
People Tank is far from finished but we have a clear perception of what we want People Tank to be. We want it to be clear and easy to use for everyone, revolutionize the way we socialize with friends and family but most importanlty we want it to be free but we can only achieve this with your early support for our idea. That's why we ask if you can afford to give us a small donation to help us cover our costs. Any amount is greatly appreciated.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary disabled">Donate With PayPal</button>
</div>
</div>
</div>
</div></form>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Register</h3>
</div>
<div class="panel-body">
<form action="register.php" method="post">
<div class="form-group">
<label for="firstname">First Name</label>
<input type="text" class="form-control" id="firstname" placeholder="First Name" name="firstname" value="" >
</div>
<div class="form-group">
<label for="secondname">Second Name</label>
<input type="text" class="form-control" id="secondname" placeholder="Second Name" name="secondname" value="" >
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" id="username" placeholder="Username" name="username" value="" >
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" id="email" placeholder="Email" name="email" value="" >
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" id="password" placeholder="Password" name="password" value="" >
</div>
<div class="form-group">
<label for="gendeer">Select Gender</label>
<select name="gender" id="gender" class="form-control">
<option>Male</option>
<option>Female</option>
</select>
</div>
<p>DOB:<br />
<?php
$con = mysql_connect('localhost','root',"");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("peopletank", $con);
$name= mysql_query("select * from month");
echo '<select name="month" id="user" class="textfield1">';
while($res= mysql_fetch_assoc($name))
{
echo '<option>';
echo $res['month'];
echo'</option>';
}
echo'</select>';
mysql_close($con)
?>
<?php
$con = mysql_connect('localhost','root',"");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("", $con);
$name= mysql_query("select * from day order by day_id asc");
echo '<select name="day" id="user" class="textfield1">';
while($res= mysql_fetch_assoc($name))
{
echo '<option>';
echo $res['day'];
echo'</option>';
}
echo'</select>';
mysql_close($con)
?>
<?php
$con = mysql_connect('localhost','root',"");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("", $con);
$name= mysql_query("select * from year");
echo '<select name="year" id="user" class="textfield1">';
while($res= mysql_fetch_assoc($name))
{
echo '<option>';
echo $res['year'];
echo'</option>';
}
echo'</select>';
mysql_close($con)
?>
<br /><br />
<input type="submit" class="btn btn-success" value="Register" />
<a class="btn btn-primary disabled" href="#">Register with Facebook</a>
<a class="btn btn-info disabled" href="#">Register with Twitter</a>
</p>
</form>
</div>
</div>
</div>
</div>
</div>

Answer 1

Ok, this Bootply should give you the general idea.
Bootply
And here's the code:
<div class="container">
<div class="col-lg-6">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Sign In <span class="pull-right">Forgot password?</span></h3>
</div>
<div class="panel-body">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">News</h3>
</div>
<div class="panel-body">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Register</h3>
</div>
<div class="panel-body">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Basically, it's a col structure within a col structure, so that each column can have multiple "rows"; or in your case panels. Just fill in the panel-body with your inputs, and it should work fine for you.
Cheers!