I have a page which is designed using CSS layout. It has a simple form where two spans are used as columns. In the 1st span, i have used float:left and width to create width of the 1st column. In the second span when i have more data (say more than 3 lines) then the third line is coming from the extreme left instead of confining to the second column.

If i specify width and float for the second column(span) also then it works. But i don't want to do that in that way.

Using display:block is also not solving the problem completely. Please help me in resolving this problem.

If i specify width and float for the second column(span) also then it works. But i don't want to do that in that way.

But that's how you do it. You float the columns and specify a width for each, otherwise the right content will always kick back to the far left side of the containing div.

Also, I would use div's for those. Why use span and then have to specify "block"? Div's are block by nature.

Also, your spans could end up inheriting other span styling in the same container as well.

A link always helps too when available.

Hi mushget, i would use lists <li> or divs to answer your question.

this way its much more organized rather than using span tag. span tags are generally used for <p> tags, on my own experience.

I have a page that has been created using CSS layout. This is a simple form where the two spans are used as columns. 1 At times, I have used float: left and width to create 1 column width.

Originally Posted by ilitrato

Hi mushget, i would use lists <li> or divs to answer your question.

this way its much more organized rather than using span tag. span tags are generally used for <p> tags, on my own experience.

i would have thought that <p> tags are used for <p>. you could of course use <span> within a <p>