SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Zealot shiftless's Avatar
    Join Date
    Mar 2005
    Posts
    137
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    no background color (sometimes) in IE6

    can someone explain this strange behavior in IE? I am using a test page to illustrate:

    http://www.aftermath-creative.com/test/kennedy/test.htm

    Why doesn't IE6 put a background color on the top box (purple/pink) but it will on thee one further down, which is the EXACT same code. I have tried many versions of this page and it always skips the background color of the top box.

    If I give the projT a width, it will give it a background color but it screws up my layout and isn't a workable solution as the same container needs to be different widths on other pages.

    HTML:
    Code:
    <!-- Begin sister site panels buttons-->
    		<div id="sisters">
    			<div class="clear"></div>
    			<div class="greyBorder">
    				<div class="projT">
    					<a href="projectT.htm" onFocus="this.blur()"><img src="images/logo_projT.gif" width="190" height="62" border="0" alt="Project T logo"/></a>
    					<p><a href="projectT.htm" onFocus="this.blur()">Open to HIV-negative gay men and transgender women ages <br />18- 60. Get involved &raquo;</a></p>
    				</div>
    			</div>
    			<div class="greyBorder">
    				<div class="sfReady">
    					<a href="sfisready.htm" onFocus="this.blur()"><img src="images/logo_sfready.gif" width="190" height="75" border="0" alt="SFisReady logo"/></a>
    					<p><a href="sfisready.htm" onFocus="this.blur()">HIV vaccine trials are open to healthy, HIV-negative people of all sexual preferences, ages 18 - 50. Get involved &raquo;</a></p>
    				</div>
    			</div>
    			<div class="greyBorder">
    				<div class="projT">
    					<a href="projectT.htm" onFocus="this.blur()"><img src="images/logo_projT.gif" width="190" height="62" border="0" alt="Project T logo"/></a>
    					<p><a href="projectT.htm" onFocus="this.blur()">Open to HIV-negative gay men and transgender women ages <br />18- 60. Get involved &raquo;</a></p>
    				</div>
    			</div>
    			<div class="greyBorder">
    				<div class="sfReady">
    					<a href="sfisready.htm" onFocus="this.blur()"><img src="images/logo_sfready.gif" width="190" height="75" border="0" alt="SFisReady logo"/></a>
    					<p><a href="sfisready.htm" onFocus="this.blur()">HIV vaccine trials are open to healthy, HIV-negative people of all sexual preferences, ages 18 - 50. Get involved &raquo;</a></p>
    				</div>
    			</div>
    		<div class="clear"></div></div>
    CSS:

    Code:
    .projT {
    
    	border: #FFFFFF solid 3px; 
    	text-align: left;
    	line-height: 14px;
    	background-color: #B71B8B;
    	color: #FFFFFF;
    	font-weight: bold;
    	padding-bottom: 15px;
    }
    html>body .sfReady {padding-bottom: 0px;}
    
    .projT p { margin-left: 12px; margin-top: 5px; color: #FFFFFF;}
    .projT a { font-family: arial, helvetica, verdana, sans-serif; font-size: 11px; color: #FFFFFF; text-decoration: none;}
    .projT a:visted {color: #FFFFFF;}
    .projT a:hover {text-decoration: underline;}
    
    .sfReady {
    
    	border: #FFFFFF solid 3px; 
    	text-align: left;
    	line-height: 14px;
    	background-color: #51B948;
    	color: #FFFFFF;
    	font-weight: bold;
    	padding-bottom: 15px;
    }
    html>body .sfReady {padding-bottom: 0px;}
    
    .sfReady p { margin-left: 12px; margin-top: 5px; color: #FFFFFF;}
    .sfReady a { font-family: arial, helvetica, verdana, sans-serif; font-size: 11px; color: #FFFFFF; text-decoration: none;}
    .sfReady a:visted {color: #FFFFFF;}
    .sfReady a:hover {text-decoration: underline;}
    
    .greyBorder {border: #DCDDDD 3px solid; margin-left: 12px; margin-bottom: 15px;margin-top: 15px;}
    
    #sisters {
    	position: relative;/*ie needs this to show float */
    	width: 213px;
    	margin-right: 33px;
    	float: right;
    	text-align: center;
    	border: none;
    	display: inline;
    }

  2. #2
    SitePoint Zealot shiftless's Avatar
    Join Date
    Mar 2005
    Posts
    137
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK, giving projT a height of 1% seems to have worked, though I have no idea why. Can anyone explain this behavior?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •