Actually Martin,
The flexible div does still expand to fit the whole wrapper in FF3 etc. It
is disguised by the background colours. If you remove all the bk colours
apart from the elastic one, you'll see this in action!
:-(
Bob
----- Original Message -----
From: "designer" <desig...@gwelanmor-internet.co.uk>
To: <wsg@webstandardsgroup.org>
Sent: Thursday, October 08, 2009 10:24 AM
Subject: Re: [WSG] elasticity and floats
Thanks Martin,
I tried your mark-up, but found a gap between adleft1 and 2. I shifted the
outer div, removed the margins and Presto! [1] However, I'm getting
confused
now as to why this should work whilst others didn't [2]
Bob
[1]http://www.rspcacornwall.org.uk/testbed/floatdivs_martin.html
[2] http://www.rspcacornwall.org.uk/testbed/floatdivs_cjapplied.html
----- Original Message -----
From: "Martin Heiden" <martin.hei...@netcologne.de>
To: "designer" <wsg@webstandardsgroup.org>
Sent: Wednesday, October 07, 2009 8:36 PM
Subject: Re[2]: [WSG] elasticity and floats
Hi Bob!
May I add another wrapper div? Try the following. Probably you want
to tweak some withs and margins.
Regards,
Martin.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml";>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<style type="text/css">
#outer {
border: 1px solid red;
width: 50%;
}
#inner {
margin-left: 250px;
margin-right: 100px;
}
#adleft1 {
float: left;
width: 100px;
height: 100px;
margin-left: -250px;
background: #c00;
}
#adleft2 {
float: left;
width: 100px;
height: 100px;
margin-left: -100px;
background: #0c0;
}
#adcenter {
height: 100px;
background: #00c;
margin: 0 -1px;
}
#adright {
float: right;
width: 100px;
height: 100px;
margin-right: -100px;
background: #c00;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
<div id="adleft1"></div>
<div id="adleft2"></div>
<div id="adright"></div>
<div id="adcenter"></div>
</div>
</div>
</body>
</html>
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
