0

Hi,
In IE, two rows and two columns in each row are coming correctly. But in firfox, it is coming as 3 columns in first row and 1 column in second row. The code is given below.Any solution for this problem ? please help.

<div style="width:60%" align="left">
<div>
<div align="left" style="float: left;width:30%;">row1 column1</div>
<div align="left" style="float: left;width:30%;">row1 column2</div>
</div>
</div>
<div style="width:80%" align="left">
<div>
<div align="left" style="float: left;width:30%;">row2 column1</div>
<div align="left" style="float: left;width:30%;">row2 column2</div>
</div>
</div>

2
Contributors
2
Replies
3
Views
7 Years
Discussion Span
Last Post by Rajicet
0

Align on div is deprecated and should not be used. Instead use: style="float: ..."

If you can't get it to show correctly after changing align then just use float:left on the left column and float:right on the right column. It can also be a problem with the width of the div's according to the container. Try adding a px or two :)

0

For the second row, we can use Clear property.

<div style="width:60%;clear:both" align="left">
<div>
<div align="left" style="float: left;width:30%;">row1 column1</div>
<div align="left" style="float: left;width:30%;">row1 column2</div>
</div>
</div>
<div style="width:80%" align="left">
<div>
<div align="left" style="float: left;width:30%;">row2 column1</div>
<div align="left" style="float: left;width:30%;">row2 column2</div>
</div>
</div>

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.