| floating divs not flowing on Android zoom
|
george93510
msg:4361543 | 7:29 pm on Sep 12, 2011 (gmt 0) |
I have a page with 3 floated columns. If I resize the window or zoom in, I want the floats to flow one underneath the other when the window isn't wide enough. This works in PC-type browsers, but on the Android text re-flows, but floated columns don't. So when I zoom in the right column(s) get cut off as if they were columns in a table.
How do I get this layout to flow on the Android? Will I have the same problem on iPhones?
My HTML:
<!DOCTYPE html>
.
.
.
<div class="col">
column 1 content
</div>
<div class="col">
column 2 content
</div>
<div class="col">
column 3 content
</div>
My CSS:
.col {
float: left;
margin-right: 25px;
}
|
alt131
msg:4363280 | 8:51 am on Sep 16, 2011 (gmt 0) |
Hi george93510, and welcome to WebmasterWorld :)
I would expect the provided code to work as desired - have you double-double checked there is nothing else affecting the floats?
Also, what browser?
|
george93510
msg:4363416 | 3:24 pm on Sep 16, 2011 (gmt 0) |
It works as desired on Firefox and Internet Explorer. The problem is on the Android browser.
|
|
|
