ウェブページのレイアウト以下

Question

画像は実際の問題は、あなたがこのパズルです、およびJavaScriptで作成されている見ることができるように

が何であるかを示してサイズを変更します。このようにして各行が作成されます。

でもこの問題を保持 floatスタイルを使用して

document.write("<div style='float:none'>"); 
for(i=0; i < 4 ; i++) { 
     for(j=0; j < 4 ; j++) { 
     imgArray[i] = "Images/" + x + ".jpg"; 
     document.write("<img id= " + x + " src='Images/" + x + ".jpg' width='120' height='120' style='position:relative;top:50px;left:50px' onclick='checkMove(parseInt(id))'/>"); 
     x = x + 1; 
     } 
     document.write("<br>"); 
} 
document.write("</div>"); 

。 ロックする方法がありますウィンドウのサイズをxより小さくすることはできませんか？あなたは何が間違っているのか、やっていないのか、正しい方向で私に指摘してください。

Answer 1

divに固定幅を追加しようとしましたか？

<div style='float:none;width:480px;'> 

Answer 2

divに幅（px）を指定すると、サイズ変更によってスクロールバーが表示されます。

document.write("<div style='float:none;width:600px'>"); 

Answer 3

コンテナdivの幅を480pxの4つの画像の幅に設定するには、CSSを使用します。

Answer 4

はdiv要素のスタイルに

white-space: nowrap; 

を入れてみてください。その内容が折り返されないようにする必要があります。代わりに水平スクロールバーが表示されます。

Answer 5

また、最小幅http://www.w3schools.com/jsref/prop_style_minwidth.aspとそれに相当するCSSについて考えてみましょう。