2014-12-01 67 views
1

我一直在按照正确的顺序在我的网站上获取列时遇到了麻烦。我希望红框(在登录框下)成为另一个新闻小组。但我无法解决如何做到这一点的任何想法。 https://www.dropbox.com/s/vgwhpurwo15gvet/Capture.PNG?dl=0彼此之下的列Bootstrap

<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"><a href="forgotpassword.php">Forgot password?</a></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">&times;</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) 


?> 
&nbsp;<?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> 
+0

你可以发布你的当前代码吗?这比屏幕帽更有用。 – 2014-12-01 16:59:21

+0

增加了其混乱 – mattmill98 2014-12-01 17:02:34

+0

这很好,现在为你做一个bootply。 – 2014-12-01 17:04:29

回答

0

好吧,这Bootply应该给你的总体思路。

Bootply

而这里的代码:

<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"><a href="forgotpassword.php">Forgot password?</a></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> 

基本上,它是一个col结构内的col结构,使每一列可以有多个 “行”;或在你的情况面板。只需填写panel-body与您的输入,它应该适合你。

干杯!

+0

非常感谢您的帮助:) – mattmill98 2014-12-01 17:22:19

+0

没问题,很高兴我可以帮忙! – 2014-12-01 17:23:00