Ok I cry Uncle. I've spent hours and hours trying to figure this
layout....
tried everything, read books, drilled the net, started all over....

I am having trouble making this fluid so it degrades reasonably to
800px.

The two problem items are the element that contains the Part#, Price,
etc. and the SWF object element.

The first does not wrap to left when at 800px and back out when wider
as desired.

The second part with the SWF object wraps undesirably out of view
down to the bottom of of the category tree div that is floated left.

Safari Mac: checks with good wrapping behavior on both elements.
http://beta.handmade-paper.us/800pxSafariMac.jpg
http://beta.handmade-paper.us/1024pxSafariMac.jpg

Firefox Mac: element for the Part# etc wrong wrap behavior
http://beta.handmade-paper.us/1024pxFFMac.jpg

Firefox 3.0 Windows: All Good

IE 7 Windows: All Bad
IE 6 Windows: SWF object wrap bad

That should give you an idea of desired layout behavior.

Ext Style Sheet:
http://beta.handmade-paper.us/Merchant2/cpo.css
Here is paste of most relevant styles for the layout being examined.

/* Product Level Layouts */

#cattree_prodlvl {
margin-left: 5px;
margin-right: 3px;
font-size: .7em;
line-height: 1.3em;
border-color: aqua;
border-style: dotted;
float: left;
}

#wrapper_prodlvl {
border-color: red;
border-style: dotted;
white-space: normal;
margin-left: 12em;
}

#wrapper_zone1_prodlvl {
border: 4px dotted blue;
}

#wrapper_zone1b_prodlvl {
border: 4px dotted yellow;
display: inline-block;
}

#breadcrumb_prodlvl {
padding: 2px;
font-size: .7em;
white-space: nowrap;
}

#prodrelcats {
padding: 2px;
font-size: .7em;
white-space: nowrap;
}

#prodlevelh1 {
white-space: nowrap;
}

#prodlevelhdr {
font-size: .8em;
color: blue;
white-space: nowrap;
}

#prodlevelform {
font-size: .9em;
height: 1em;
white-space: normal;
border-color: orange;
border-width: 5px;
}

#inbasket {
font-size: .8em;
display: inline;
position: relative;
bottom: 1em;
}

#prodlevel-inputcntl {
color: maroon;
text-align: center;
position: relative;
height: 1em;
width: 2em;
font-size: .9em;
left: .50em;
bottom: .70em;
}

#zoomifychunk {
white-space: nowrap;
border: 5px dotted fuchsia;
}

#prodinfo {
padding-right: 4px;
padding-bottom: 4px;
font-size: .8em;
margin-top: 5px;
white-space: nowrap;
display: inline-block;
border-left: 1px solid black;
padding-left: 4px;
border-right: 1px solid black;
}

#prod-desrip {
font-size: .8em;
margin: 6px;
border-color: aqua;
border-width: 2px;
}

#prodlevel-image {
float: left;
display: none;
}

#prodfooter {
font-size: .9em;
margin: 6px;
border-color: teal;
border-width: 2px;
}

#relatedprods {
margin: 6px;
border-color: maroon;
border-width: 2px;
}

/* End Product Level Layouts */



Thanks,
Barrett
AOL/AIM handmadepaperus


--
This list is a free service of LassoSoft: http://www.LassoSoft.com/
Search the list archives: http://www.ListSearch.com/GoLive/Browse/
Manage your subscription: http://www.ListSearch.com/GoLive/