Float left

[otuatail]

<div style="width:220px;height:75px;">

<div style="width:80px;height:25px;float:left;">KeyAsk</div><div style="width:40px;float:left;"><input type="text" name="Ask" style="width:30px" maxlength="2" value="<?=$rs['KeyAsk']?>"></div><div style="width:100px;color:red;float:left;">Invalid</div>
   
<div style="width:80px;height:25px;float:left;">KeyChange</div><div style="width:40px;float:left;"><input type="text" name="Change" style="width:30px" maxlength="2" value="<?=$rs['KeyChange']?>"></div><div style="width:100px;color:red;float:left;">Invalid</div>

<div style="width:80px;height:25px;float:left;">current</div><div style="width:40px;float:left;"><input type="text" name="current" style="width:30px" maxlength="2" value="<?=$rs['current']?>"></div><div style="width:100px;color:red;float:left;">Invalid</div>

Hi I have done the maths and it does appear to add up.

 

I had an outer div and inside 3 rows of 2 dives float left. This worked fine until  I added a 3rd column to the rows

 

Now the first div of the second row is directly under the last element (Invalid) not returning to the left side of the outer container. Outer container width is 200px and each row of 3 is 80px, 40px, 100px. No border solids to mess it up. Help please

 

TIA

 

Desmond.

 

[otuatail]

In desperation I have had to add <br><br> to the ends of the first 2 lines. This is crazy.

[cyberRobot]

Have you tried clearing the float?

<div style="width:80px;height:25px;float:left;clear:both;">

Note the "clear:both;" declaration at the end.