爲什麼我不能讓它進入下一行？

-1

p { 
 
    font-size: 150%; 
 
} 
 

 
body { 
 
    background-image: url("images/gg.jpg"); 
 
    background-repeat: repeat; 
 
} 
 

 
.rTable { 
 
    display: block; 
 
    margin-top: 100px; 
 
    margin-bottom: 200px; 
 
    margin-right: 200px; 
 
    margin-left: 450px; 
 
} 
 

 
.rTableHeading, 
 
.rTableBody, 
 
.rTableFoot, 
 
.rTableRow { 
 
    clear: both; 
 
} 
 

 
.rTableHead, 
 
.rTableFoot { 
 
    background-color: white; 
 
    font-weight: bold; 
 
} 
 

 
.rTableHead { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 17px; 
 
    overflow: hidden; 
 
    padding: 3px 1.8%; 
 
    width: 36%; 
 
} 
 

 
.rTable:after { 
 
    display: table-cell; 
 
    visibility: hidden; 
 
    display: block; 
 
    font-size: 0; 
 
    content: " "; 
 
    clear: both; 
 
    height: 0; 
 
} 
 

 
.rTableHeads { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 20px; 
 
    padding: 3px 1.8%; 
 
    width: 55%; 
 
} 
 

 
.rTableCell { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 17px; 
 
    overflow: hidden; 
 
    padding: 3px 1.8%; 
 
    width: 15%; 
 
} 
 

 
.rTableCells { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 60px; 
 
    overflow: hidden; 
 
    padding: 3px 1.8%; 
 
    width: 15%; 
 
} 
 

 
.rTableHea { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 60px; 
 
    overflow: hidden; 
 
    padding: 3px 1.8%; 
 
    width: 36%; 
 
} 
 

 
.rTables { 
 
    background-color: white; 
 
    border: 1px solid #999999; 
 
    float: left; 
 
    height: 50px; 
 
    overflow: hidden; 
 
    padding: 3px 1.8%; 
 
    width: 15%; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>hey contact </title> 
 
</head> 
 

 
<body> 
 
    <p style="text-align: center"> 
 
    <a href="index.html">index</a> 
 
    <a href="about.html">about</a> 
 
    <a href="media.html">media</a> 
 
    <a href="contact.html">contact</a> 
 
    </p> 
 
    <div class="rTable"> 
 
    <div class="rTableRow"> 
 
     <form> 
 
     <div class="rTableHeads" align="center"><strong>Contact me</strong></div> 
 

 
    </div> 
 
    <div class="rTableRow"> 
 
     <div class="rTableCell"> <label for="Name">Name:</label></div> 
 
     <!--label 
 
    is to lable name --> 
 
     <div class="rTableHead">&nbsp; 
 
     <input type="Name" class="form-control" id="name" placeholder="Enter 
 
     name" name="name"> 
 
     </div> 
 
     <!--placeholder let the enter name comment come out --> 
 
    </div> 
 
    <div class="rTableRow"> 
 
     <div class="rTableCell"><label for="Email">Email_address:</label> 
 
     </div> 
 
     <div class="rTableHead">&nbsp; 
 
     <input type="email" class="form-control" id="email" placeholder="Enter 
 
email" email="email"> 
 
     </div> 
 
    </div> 
 
    <div class="rTableRow"> 
 
     <div class="rTableCell">Subject : 
 
     </div> 
 
     <div class="rTableHead">&nbsp; <select name="subject"> 
 
<option value="webt">Web Design</option> 
 
<option value="programming">programming</option> 
 
<option value="data">Data management</option> 
 
<option value="math">Math</option> 
 
<option value="MPU">MPU</option> 
 
</select> 
 
     </div> 
 
    </div> 
 
    <div class="rTableRow"> 
 
     <div class="rTableCells">Message : 
 
     </div> 
 
     <div class="rTableHea">&nbsp; 
 
     <textarea name="comment" rows="5" cols="30"> 
 
    </textarea> 
 
     </div> 
 
    </div> 
 
    <div class="rTables" align="center"> </div> 
 
    <!--<div class="rTableHeads" align="center"><strong>Contact me</strong> 
 
    </div> --> 
 
    </form> 
 
    </div> 
 
</body> 
 

 
</html>

我想打一排排的消息後，但是當我想打一個排它不會讓我的行。不知道爲什麼。誰能幫我？？

這裏是我的結果：

爲什麼我不能創建一個行，但它移動到消息部分的旁邊？任何人都可以告訴我爲什麼我不能進入消息行下的另一行？

來源

2017-08-31 sozai

你可以做一個JSFiddle嗎？ – Raptor

縮進至關重要！請在您的示例中修復縮進。從簡單的角度來看，我認爲問題來自未封閉或不匹配的標籤，修復縮進將更容易找到問題。 –

將clear:both;加到.rTables類。

選項2：

你可以把rTables類rTableRow內，像這樣格：

<div class="rTableRow"> 
    <div class="rTables" align="center"> </div> 
</div>

另外，如果你想使一個表，請使用HTML table結構，它會幫助你很多。

來源

2017-08-31 06:56:45

爲什麼我不能讓它進入下一行？

回答

相關問題