homepage Welcome to WebmasterWorld Guest from 54.205.105.23
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
floating divs not flowing on Android zoom
george93510



 
Msg#: 4361541 posted 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

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4361541 posted 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#: 4361541 posted 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.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved