tags:

views:

17

answers:

1
Q: 

Two floated divs, one that isn't always there and how to get the other to stretch?

I have two floated divs which appear side by side as they should, however I want to have div 1 stretch to the full width of its container when div 2 is not present. I've tried doing this by removing the width of div 1 (while leaving the width of div 2) however this breaks the float and pushes div two to a new line.

Can anyone advise me how I can achieve a div which auto-stretches to the full width of the container when the second div is not present?

A: 

Can't you just have server-side code that generates an extra class name on one of the divs to be say, 'wide-float' when the other isn't present?

meder  2010-09-18 17:20:57
Hi Thanks for replying. The problem is that I need to specify a width for Div 1. This is fine when Div 2 is present, but when it isn't Div 1 remains at that fixed width, whereas I'd need it to stretch to the entire container width.
Michael  2010-09-19 01:18:05
As you suggested I was able to write a server side command using a conditional statement (in a Joomla install) which deploys an extra class name based on whether the Div 2 module is loaded. This is a pretty solid solution. I am still curious to know if there's a natural way to perform this with CSS though, as it seems that this would be a pretty common thing in web design. Does anyone know?
Michael  2010-09-20 00:15:13

related questions

Div Collapsing - Unwanted
div with dynamic elements pushing other div down
Css, child-divs and floating
css and divs - parent's attribute for children
How can I chronologically stack different height divs in two columns?
Question about divs in HTML web page building.
CSS - Absolutely positioned divs are not sticking to right edge when "right:0px" in IE6
Are tables replaced by DIVs?
how to select divs with jquery like for example in photoshop ? (select area)
hide show div when multiple nested layers exist
How can I find out what div a div is in with javascript?
Divs smashing into each other
Playing with PHP arrays
sIFR: Not working for custom divs more than once.
Creating a div whose size is relative to a fixed width div and containing area?
CSS - What's the best way of creating a 9x9 Sudoku grid?
How to add a background Image using CSS that looks like a border down each side of a div
CSS: min-height does not work.
CSS: Create a DIV based on browser size.
How to stop arrow keys scrolling in two DIVs in a JSP page
Float 2 divs in a parent div and arrange such divs one below another
div tags-on and off
Formatting inline items? What does the general code look like?
Drawing in javascript with divs
CSS Layout Question