thx,
I'll have a go at this later,
larry
>On 9/24/06, Larry Lyons <[EMAIL PROTECTED]> wrote:
>
>Then Casey Dougall wrote::
>
>On that note, I've made a few alterations that will fix this (at least
>to some degree), but first a couple of other minor points.
>
>You can use the shorthand method on elements such as padding, margin,
>and background without repercussion. So the following ...
>
>#header {
> height:144px;
> width:100%;
> position:relative;
> top:0; left:0;
> background-color:transparent;
> background-image: url(/images/headerBG.jpg);
> background-repeat:no-repeat;
> background-position: right top;
> text-align:center;
> }
>
>... would become
>
>#header {
> height:144px;
> width:100%;
> position:relative;
> top:0; left:0;
> background: transparent url(/images/headerBG.jpg) no-repeat top right;
> text-align:center;
> }
>
>See <URL:http://www.htmldog.com/guides/cssintermediate/multivalue/>.
>If you're using DW or some such other editor, you can and should set
>these preferences in the program.
>
>Next, you have these rules in your content and contentColumn divs:
>
> float:left;/**/
> top: 0;
> left: 0;
>
>but left and top are only properties of absolute and relative
>positioning, serving no function here and should be removed. Also, in
>your #contentColumn you have re specified margin and padding:
>
>#contentColumn{
> float:left;
> top: 0; left: 0;
> /*min-width:60%;*/
> max-width:500px;
> width:470px;
> position:relative;
> margin: 0px;
> padding:0px;
> padding-left:5px;
> padding-right: 5px;
> margin-left:5px;
> height:auto;
> vertical-align:top;
> font-size:.85em;
>}
>
>This entire rule can be rewritten like so:
>
>#contentColumn{
> float:left;
> /*min-width:60%;*/
> max-width:500px;
> width:470px;
> position:relative;
> padding: 0 5px;
> margin-left:5px;
> vertical-align:top;
> font-size:.85em;
>}
>
>Now onto the breaking layout. Change your #contentColumn to the following:
>
>#contentColumn{
> margin: 0 255px 0 155px;
> padding-left: 5px;
> padding-right: 5px;
> vertical-align: top;
> font-size: .85em;
> }
>
>and add ...
>
>/*hide from ie mac\*/
> * html #contentColumn {height: 1%; margin-left: 5px;}
>/**/
>
>... which prevents the 3px jog from taking effect in IE (since I've
>altered the contentColumn to use margins only for positioning this
>allows it to become liquid, but in doing so I had to remove the float
>since floats always require a width (according to the specs) and this
>then triggers that IE bug. If you don't like the holly hack then feel
>free to use conditional comments. I see you've encountered this bug
>elsewhere on your site so this should be nothing new.
>
> From #rightColumn, remove all of these:
>
>margin: 0;
>margin-left:2px;
>padding:0;
>padding-left:2px;
>
>None of them are required for your layout. You are also using a
>min-height of 400px on most of your layout divs for some reason. I
>understand why this is sometimes required, and I use it myself from time
>to time, but here there is no need. Remove them all and add a left clear
>to your footer to keep that below everything.
>
>#footer {
> text-align: center;
> clear: left;
> /*clear: both;*/
> padding:2px 0 5px 0;
> margin:2px 0 5px 0;
> width:100%;
> }
>
>And finally, in your html, change the source order so that the
>#rightColumn comes before your #contentColumn:
>
><div id="content">
><div id="leftNav">
><p> <br /></p>
><ul>
><li><a href="http://www.surfatas.com/pointOfUse/organic.cfm";>Organic
>Compounds</a></li>
><li><a
>href="http://www.surfatas.com/pointOfUse/dissolvedMetals.cfm";>Dissolved
>Metals</a></li>
></ul>
><p> </p>
><p> </p>
></div>
>
><div id="rightColumn">
><img src="industrial.cfm_files/rightSideBG.jpg" alt="right side fluff"
>title="right side image" border="0"/>
></div>
>
><div id="contentColumn">
><a name="skipContent"></a>
><h3>Industrial, Wastewater</h3>
><p>Industrial water contaminant reduction poses unique challenges,
>particularly dependent upon targeted contaminants, concentration
>levels, and the relative cost/benefits to their capture and disposal or
>recovery. From contaminated earth remediation or ground water concerns
>to precious metal recovery in mining and chemical processing, our
>extensive knowledge of material performances gives our clients the
>confidence to focus their efforts on what they know best.</p>
><p>Surfatas brings a bundle of technologies and materials to your
>situation. Our team can work with your partners, vendors, and suppliers
>to complement what is already in place. Of course, we can also support
>your efforts in developing an entirely new solution to your problems,
>using the latest in technologies, additives, and materials. Surfatas
>technologies are effective at parts per thousand or parts per million.
>They can be either broad in spectrum or highly specific. We understand
>other characteristics of the fluid will play a factor as well. The
>Surfatas technologies are designed to function in a wide variety of
>conditions as well.</p>
><p>What kind of contaminants is your team challenged with?</p>
><div id="horizontalList"><ul><li><a
>href="http://www.surfatas.com/pointOfUse/organic.cfm"; title="Organic
>Compounds">Organic Compounds</a></li><li><a
>href="http://www.surfatas.com/pointOfUse/dissolvedMetals.cfm";
>title="Dissolved Metals">Dissolved Metals</a></li></ul></div>
><p> </p>
></div>
></div>
>
>If you prefer that your content come nearer the top of your source, then
>use one of these layouts instead:
><URL:http://blog.html.it/layoutgala/>
>
>And I just noticed in your leftnav you also seem to be using empty
>paragraphs above and below your navigation for spacing. No need for this
>at all. Simply apply either a top and bottom margin (or padding) on the
>ul (or even the leftnav itself would work in this situation) and remove
>the empty paragraphs.
>
>Hopefully I haven't forgotten anything critical to making this work.
>Tested locally on IE6, Firefox 1.5.07, and Opera 9. If none of this
>makes sense just write me off-list.
>
>HTH
>Mark
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting,
up-to-date ColdFusion information by your peers, delivered to your door four
times a year.
http://www.fusionauthority.com/quarterly
Archive:
http://www.houseoffusion.com/groups/CF-Community/message.cfm/messageid:215945
Subscription: http://www.houseoffusion.com/groups/CF-Community/subscribe.cfm
Unsubscribe:
http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.5
