2
私はプログラミングにちょっと新しく、この問題を解決できません。パラグラフは階段のように出てきます。HTML段落が直線にならない
p
p
p
p
p
pは例ですが、これまでに行ったすべてのコードを示します。 どう修正この問題で私を見ると、どこ私のコードで教えてくださいすべてのヘルプは
をいただければ幸い私は（私はまだ学んでいる）CSSで最高じゃない心の中で
をキープこの問題が発生しています。
私はそのようにレンダリング段落の理由は.houseDetails上floatセットの結果です...
var house = {}
function House() {
\t var msg = 'This house is painted'
\t var bath;
\t var bed;
\t var cook;
\t var Paint = document.getElementById('paint').value;
\t var square = document.getElementById('Square').value;
\t var bath = document.getElementById('bath').value;
\t var bed = document.getElementById('Bed').value
\t var cook = document.getElementById('Cook').value;
\t //Get paragraphs to store values
\t var paint = document.getElementById('isPaint');
\t var squareFeet = document.getElementById('sq_Feet')
\t var bathRoom = document.getElementById('bathroom')
\t var bedRoom = document.getElementById('BedRoom')
\t var kitchen = document.getElementById('kitchen');
\t if(Paint == 'Yes' || Paint == 'yes') {
\t \t house['isPainted'] = true;
\t \t paint.innerHTML = msg;
\t }
\t else if(Paint == 'No' || Paint == 'no') {
\t \t house['isPainted'] = false;
\t \t var msg = 'this house is not painted'
\t \t paint.innerHTML = msg;
\t }
\t else if(Paint == '') {
\t \t house['isPainted'] = undefined;
\t \t var msg = 'no details given';
\t \t paint.innerHTML = msg;
\t }
\t if(square != '') {
\t \t var squareFeetMsg = 'the house is';
\t \t squareFeet.innerHTML = squareFeetMsg + ' ' + document.getElementById('Square').value + ' square feet';
\t \t house['squareFeet'] = document.getElementById('Square').value
\t }else {
\t \t var squareFeetMsg = 'No Details Given';
\t \t squareFeet.innerHTML = squareFeetMsg;
\t }
}body {
\t width: auto;
\t height: auto;
}
#houseDtails{
\t width: 350px;;
}
#container {
\t width: auto;
\t height: auto;
}
.houseDetails {
\t height: 0px;
\t float: right;
}<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <title>House App</title>
\t <link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div id="conatainer">
\t <div id="houseDtails">
\t \t \t <label for="paint">Is this house painted: </label><br>
\t \t \t <input type="text" id="paint" class="Detail" /><br>
\t \t \t <label for="Square">How many SQ feet does this have? :</label>
\t \t \t <input type="text" id="Square"><br>
\t \t \t <label for="bath">How many bathrooms does your house have</label>
\t \t \t <input type="text" id="bath"><br>
\t \t \t <label for="Bed">How many bedrooms dos your house have</label>
\t \t \t <input type="text" id="Bed"><br>
\t \t \t <label for="Cook">Does your house have a kitchen</label>
\t \t \t <input type="text" id="Cook"><br>
\t \t \t <input type="submit" name="" id="sub" class="subm" onclick="House()">
\t </div>
\t <div id="addDetailsToPage">
\t \t <p id="isPaint" class="houseDetails"></p>
\t \t <p id="sq_Feet" class="houseDetails"></p>
\t \t <p id="bathroom" class="houseDetails"></p>
\t \t <p id="Bedroom" class="houseDetails"></p>
\t \t <p id="Kitchen" class="houseDetails"></p>
\t </div>
</div>
\t <script src="House.js"></script>
</body>
私はあなたがこのように見えるように思っているとは信じられません。例がありますか？ – trav
ええ、私はそれらをもう一方の下に整列させたいですか？ –