css - how to get floated divs to stack when you zoom in


Tags: css,stack,inline

Problem :

In this responsive design I am trying for, I have three divs floating side-by-side, which get narrower and narrower when you zoom in on them. I would like them to keep their size and stack instead. How do I do this? I am beginning jquery, but for this would prefer to stick to css if possible.

Here is the relevant styling I have for the divs and their parent container div:

#container {
margin-left:auto;
margin-right:auto;
width:110%}

.floating-div {
width:27%;
min-width:27%;
height:420px;
float:left;}

Thanks for reading~



Solution :

solved it. I changed width % to px for the floating div.


    CSS Howto..

    Why do small spaces keep showing up in my web pages?

    How can I disable my css sprite nav bars hover state for a section while it is active?

    How to adjust the position of specific elements/items/content on a page with CSS

    How can I inject a static CSS File in GWT like it is done with JS Files?

    Jquery/CSS - how to clear a CSS-background set in another file I can't edit

    How do I increase the width of a navbar dropdown?

    Font Styling Issue ~ how to make font smooth/Strong in html css

    How to make HTML pages print at a consistent size from Chrome?

    How to blur one side of the div using CSS

    How to put images behind each other in css

    How to get the scroll bar with CSS overflow on iOS

    How to get the perticluar image from large set images in one image using css

    How to solve CSS -webkit-appearance issue

    How to display html with css stylesheet in TextView?

    How to achieve equal horizontal AND vertical margins, AND equal column width in CSS?

    How much client-side programming is needed when doing server-side programming?

    How to make a button light up on hover with twitter bootstrap

    How do I hide text that is not wrapped in

    or ?

    How to vertically align the text into a coloured div using CSS?

    How do I line up CSS elements? Is there a tool I can use?

    How to place the block on the top of “second” screen using CSS?

    How do I add an image to a progress bar in HTML/CSS?

    how to zoom in an image and center it

    How do I change the :-moz-placeholder color with jQuery once it's set?

    How to create a set of css rules for safari

    How to get CSS to select ID of specific pattern? [duplicate]

    how to implement background img

    How to target tablet devices with CSS queries

    how can I make my navbar scroll smoothly to the top on page click

    How to align the bottom of two left- and right aligned texts with bottom of parent container?