I'm attempting to re-design a website using CSS layout. It looks fine
in Safari, Opera (Mac) and FireFox (Mac/PC), but not IE (Mac/PC). I've
identified 4 rendering issues, I'll mention the most glaring 2 here.

No doubt my issues have been addressed in this list, but i've done a
bunch of reading, and am not sure how to describe the issues in a
search string, so with apologies for asking the
already-answered-someplace...

PROB 1: Floated <img> 'hangs down' below parent container.
I thought I'd found the fix in 'How To Clear Floats Without Structural
Markup' from www.positioniseverything.net, and added the 'fix' code to
my CSS, but no improvement. That fix calls for a class selector, but I
used an ID selector since my parent div's HTML used ID. I don't think
this is why the fix doesn't work, 'tho, 'cuz I tried the other way
also.

Somewhat related to this problem: It would be great to find a
workaround for IE's failure to support min-height for pages with
longer nav-column than content (instead of a bunch of <br />'s).

PROB 2: On a couple of pages the text displays as if it's in a narrow
<td> (but it isn't). I have no idea why.

All is illustrated here: http://www.vsi.cape.com/~dagnew/arc/test.php

Below is the fix I added to my CSS (I'll gladly post all the CSS if
someone nibbles at this).
Thanks in advance to any and all suggestions.



#content {
        margin:0 10px 0 168px; /* INTERDEPENDENT with •• */
        padding: 0; /* */       
        background-color: #fff;
        border-left: 1px solid gray;
        border-top: 1px solid gray;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
  }
  
#contentbody:after { /* PRIMARY CONTENT AREA */
        min-height: 430px; /* to avoid using <br /> to keep footer down - but
NG in IE */
        
/* FIX to force IE to vertically expand div to accomodate imgs: */
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
        }
        
/* FIX to force IE to vertically expand div to accomodate imgs: */
#contentbody {
        display: inline-table;
        padding: 6px; /* disabling didn't fix IE probs */
        }
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to