how to control div size when other divs are changing [duplicate]


Tags: asp.net,html,css

Problem :

Possible Duplicate:
CSS - Equal Height Columns?

I'm not the greatest with css, so my page layout looks like this:

<div style="width:80%;border:1px solid #000;">
    <div style="float:left; width:33.3%; background:#aaa;">one</div>
    <div style="float:left; width:33.3%; background:#bbb;">two</div>
    <div style="float:left; width:33.4%; background:#ccc;">three</div>
    <div style="clear:both;"></div>
</div>

div one has the side links and image

div two holds the main content

div tree has some ads div

now when the main content increases in size the other two stay the same height, so how do I get the height for all 3 divs to increase??



Solution :

I used this recently for one of my websites.

http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

This worked great for me. you may have to reverse engineer the code a little to get your columns to the right widths for you.


    CSS Howto..

    How to use font-family with same name?

    How to center divs on page

    How to use a backslash in css content property?

    How to properly set the 100% DIV height to match document/window height?

    How to inline elements with CSS

    How can I prevent the Featherlight lightbox from creating recursive dialogs?

    How do you make a button increase in size (125%) for few milliseconds and then return it original size on click?

    Print CSS: How do I open a new tab of the current page and append CSS?

    CSS Fixed width right, fluid left, right div is first in html. How do I keep left from collapsing

    How to insert spaces/tabs in text using HTML/CSS?

    How to fit a button to a hover box? And the button is not displaying properly?

    How to make a horizontal div scroll bar float like a fixed CSS div

    How can i make 3 independently scrollable columns

    How to display block from left to right in css

    How to set a menu hover delay

    How to use min-width for “float:right” element in CSS?

    How to change CSS of website if accessed through a mobile browser [closed]

    How to re-render a page from a Google Chrome extension?

    Gulp : How to copy multiple files and keep the folder structure

    How to put text in the center of box while using border-box in CSS?

    How can I check if CSS calc() is available using JavaScript?

    How do I get
    margin working?

    jquery - how to queue up a series of css property changes

    How to layout ASP.Net RadioButtons with Images?

    How to Use JavaScript to Change a Cascading Style Sheet (CSS) Dynamically

    How do I make the child-div to have a fixed position?

    How to create a image frame by css?

    How does chrome extend the search window beyond the browser window

    How to make css counter works with css selector?

    How to obtain non-uniformly scrolling elements and layered “curtain-like” backgrounds on a webpage?