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 create a separated menu with logo in between

    how to add a permanent line on top of ios7 in phonegap

    how to zoom in an image and center it

    how to show limited text in css [closed]

    How can I make this section of my webpage responsive? [closed]

    How to assign CSS to mobile page in asp.net

    How to edit CSS styles in JavaScript?

    How do I make CSS hover transitions animate on mouse off AND mouse over, and replicate that in jQuery?

    How can I add read more click event to only open one news article?

    How do I detect a transition end without a JavaScript library?

    How do I bind data to a CSS property without using the style attribute of the element in Dart web-ui?

    SharePoint 2007 popup rich text editor displays corporate logo from master page - how can I remove this?

    How to write css code in javascript? (Uncaught TypeError: Cannot set property “height” of undefined)

    How to get CSS selectors to work in the Developer Tools for Chrome 17?

    How to get the textarea to be same height as row

    I applied CSS auto-resizing to image, now how do I push it to the background?

    PHP foreach, CSS and jQuery script.. How to interact?

    How do you create boxes like github's explore section?

    Show a caption with a semi-transparent color overlay when hovering over an image

    How to Automatically adjust width in CSS so horizontal scrollbars would adjust automatically without taking so much space?

    CSS selectors: how to make element hovering change wrapper's style

    How do I add a CSS class to a BoundField, so I can find it with jQuery?

    How do I place the text on the image in the header?

    how to create two columns with div and CSS

    How to highlight a row of my table

    How to add a sliding div to these CSS Message Bubbles?

    How to cancel a too-broad CSS color declaration in a later stylesheet?

    How can I float a bunch of divs and still get overflow?

    How to emulate iOS style dropdown menus with html, css, javascript/jquery?

    Ionic: how to use cssClass in $ionicPopup?