rirweboalomia
New Member
I'd like to create some "table rows" using \[code\]<div>\[/code\] and \[code\]<span>\[/code\]. (Why not use actual table rows? Because I want to set rounded corners on each table row using the awesome jquery corner plugin, and it doesn't seem to like table rows.) I'd like three-cell rows, with LH and RH cells of fixed width, and a central cell of fluid width, in which the text should wrap. \[code\][fixedwidth][wrapwrapwrapwrap ][fixedwidth][fixedwidth][wrapwrapwrapwrapwrapwrapwr][fixedwidth] apwrapwrapwrapwrapwrapwr[fixedwidth][wrapwrapwrapwrap ][fixedwidth]\[/code\]This is what I have so far, but it's disastrously wrong: \[code\]<html> <head><style>.table-row { width:100%;}.cell1 { float: left; width: 200px;}.cell2 { float: left;}.cell3 { float: right; width: 200px;}</style></head><body> <div class='table-row'><span class="cell1">Title</span><span class="cell2">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</span><span class="cell3">Available</span></div></body></html>\[/code\]The central text doesn't wrap, and pushes down onto the next line. Please could anyone advise?