PDA

View Full Version : Div background won't show



Taxgirl
07-12-2006, 05:56 AM
here's the link: http://www.conspiracybrand.com/main3.php

here's the code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><!-- InstanceBegin template="/Templates/main2.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>Conspiracy Brand, Inc</title>
<!-- InstanceEndEditable --><link href="cbinc.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
body {
background-color: #000000;
margin-top: 0px;
margin-bottom: 0px;
}
a:link {
color: #999900;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #440001;
}
a:active {
color: #7F7F7F;
}
-->
</style>
<link href="cbinc.css" rel="stylesheet" type="text/css">
<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
</head>

<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="middle"><div class="container" id="container"><div class="leftnav" id="LeftNav"></div>
<div class="toplinks" id="TopLinks"><img src="layout/images/p__01.jpg" alt="Navigation" width="780" height="296" border="0" usemap="#Map">
<map name="Map">
<area shape="poly" coords="0,74,45,35,150,10,182,25,180,35,175,67,151,42,95,58,62,61,27,98" href="main.php" alt="Click here to return Home">
<area shape="poly" coords="55,129,73,108,197,84,232,96,230,116,223,128,195,111,144,129,108,128,77,157" href="news.php" alt="Click here for the latest News.">
<area shape="poly" coords="153,215,149,190,184,169,234,163,283,152,324,167,322,189,313,204,290,185,240,195,190,194,166,226" href="aboutus.php" alt="Click here to learn more About Us.">
<area shape="poly" coords="201,64,203,37,232,24,295,15,351,11,380,28,381,40,371,63,338,40,290,53,246,45,218,71" href="store.php" alt="Click here to enter the Store.">
<area shape="poly" coords="267,150,247,114,283,89,334,91,391,82,429,102,429,120,417,136,385,118,343,125,298,120" href="conspiracies.php" alt="Click here to read about conspiracies.">
</map>
</div>
<div class="titlebanner" id="TitleBanner"><img src="layout/images/main-banner.jpg" width="606" height="99"></div>
<div class="content" id="Content">
<div class="contenttextbox" id="contenttextbox"><!-- InstanceBeginEditable name="main" -->main<!-- InstanceEndEditable --></div>
</div>

<?php include("leftNav.php"); ?></div></td>
</tr>
</table>
</body>
<!-- InstanceEnd --></html>


here's the html for the php include:

<div class="leftnavcontent" id="leftNavcontent">
<table border="0" align="center" cellpadding="0" cellspacing="5">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="layout/side/featured.jpg" alt="Featured Item" width="165" height="23"></td>
</tr>
<tr>
<td><img src="images/featured/freedom_haters.png" alt="Freedom Haters" width="165" height="175"></td>
</tr>
</table></td>
</tr>
<!--<tr>
<td><hr class="hr"></td>
</tr>-->
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="layout/side/didyouhear.jpg" alt="Did you hear?" width="165" height="22"></td>
</tr>
<tr>
<td class="sidedidyouhear">enter crazy conspiracy theory of the month or some random update or whatever you want. </td>
</tr>
</table></td>
</tr>
</table>
</div>


here's the css:

.toplinks {
position: absolute;
visibility: visible;
height: 296px;
width: 780px;
left: 0px;
top: 0px;
}
.leftnav {
background-color: #000000;
background-image: url('layout/images/p__02.jpg');
background-repeat: no-repeat;
position: absolute;
height: 100%;
width: 174px;
left: 0px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
.content {
background-color: #393220;
background-image: url('layout/images/p__04.jpg');
background-repeat: no-repeat;
position: absolute;
height: 100%;
width: 606px;
left: 174px;
top: 395px;
clear: both;
}
.titlebanner {
position: absolute;
visibility: visible;
height: 99px;
width: 606px;
left: 174px;
top: 296px;
}
.contenttextbox {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
left: 30px;
top: 0px;
width: 541px;
position: absolute;
height: 100%;
text-indent: 10px;
}
.leftnavcontent {
position: absolute;
visibility: visible;
height: 100%;
width: 165px;
left: 5px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
overflow: visible;
}
.hr {
border: thin solid #440000;
}
.sidedidyouhear {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-variant: normal;
text-transform: uppercase;
font-style: normal;
}
.horizoncenter
{
background-color: transparent;
position: absolute;
top: 0;
left: 0px;
width: 100%;
height: 100%;
overflow: visible;
visibility: visible;
display: block;
}

.contentcenter
{
background-color: transparent;
margin-left: -390px;
position: absolute;
top: 0px;
left: 50%;
width: 780px;
height: 100%;
visibility: visible;
}
.container {
position: relative;
width: 780px;
left: auto;
top: 0px;
right: auto;
height:100%;
}


The background won't show up in the center or on the leftside navagation. I believe it's because of the nested divs but how do I work around this???

Please, please, please, please help!!

Thank you!

~beth.

jscheuer1
07-12-2006, 06:52 AM
OK, here is your .leftnav css from your page's cbinc.css file:


.leftnav {
background-color: #000000;
background-image: url('layout/images/p__02.jpg');
background-repeat: no-repeat;
position: absolute;
height: 100%;
width: 174px;
left: 0px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}

position:absolute;z-index:0;height:100%; all conspire to make it invisible. With position absolute, 100% is relative to nothing so means height:0;. Also with that type of positioning, a z-index of 0 will have it underneath any other element that coincides with its position that comes later in the HTML code.

I cannot be sure what you are trying to have it look like but, change the declaration to:


.leftnav {
background-color: #000000;
background-image: url('layout/images/p__02.jpg');
background-repeat: no-repeat;
position: absolute;
height: 611px;
width: 174px;
left: 0px;
top: 296px;
z-index: 1;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}

and you will at least be able to see it.

Taxgirl
07-12-2006, 07:03 AM
Hey, thanks for your reply!

It's supposed to look like this:

http://www.conspiracybrand.com/main.php

only centered.

For some reason when I centered the layout, the backgrounds wouldn't appear.

they use the same stylesheet... I don't understand.

(ps. this layout doesn't continue the backgrounds on internet explorer for some reason......... urgh)

jscheuer1
07-12-2006, 05:00 PM
You can remove the <base href= . . . > tag once the page is in proper relation to its resources, and make the style external again if you like:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><!-- InstanceBegin template="/Templates/main2.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<title>Conspiracy Brand</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<base href="http://www.conspiracybrand.com/">
<!-- InstanceEndEditable -->
<style type="text/css">

body {
background-color: #000000;
margin:0;
padding:0;
}
a:link {
color: #999900;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #440001;
}
a:active {
color: #7F7F7F;
}
.toplinks {
position: absolute;
visibility: visible;
height: 296px;
width: 780px;
left: 0px;
top: 0px;
}
.leftnav {
background-color: #000000;
background-image: url('layout/images/p__02.jpg');
background-repeat: no-repeat;
position: absolute;
height: 611px;
width: 174px;
left: 0px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
.content {
background-color: #393220;
background-image: url('layout/images/p__04.jpg');
background-repeat: no-repeat;
position: absolute;
height: 500px;
width: 606px;
left: 174px;
top: 395px;
clear: both;
}
.titlebanner {
position: absolute;
visibility: visible;
height: 99px;
width: 606px;
left: 174px;
top: 296px;
}
.contenttextbox {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
left: 30px;
top: 0px;
width: 541px;
position: absolute;
height: 100%;
text-indent: 10px;
}
.leftnavcontent {
position: absolute;
visibility: visible;
height: 100%;
width: 165px;
left: 5px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
overflow: visible;
}
.hr {
border: thin solid #440000;
}
.sidedidyouhear {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-variant: normal;
text-transform: uppercase;
font-style: normal;
}

.container {
position: relative;
top: 0px;
height:870px;
width: 780px;
margin: 0 auto;
overflow:hidden;
}

* html #alpha img {
visibility:hidden;
}
* html #alpha {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='http://www.conspiracybrand.com/images/featured/freedom_haters.png', sizingMethod='crop');
}

</style>

<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
</head>

<body><div class="container">
<table border="0" cellpadding="0" cellspacing="0" class="maintable">

<tr>
<td align="center" valign="middle"><div class="leftnav"></div>
<div class="toplinks"><img src="layout/images/p__01.jpg" alt="Navigation" width="780" height="296" border="0" usemap="#Map">
<map name="Map">
<area shape="poly" coords="0,74,45,35,150,10,182,25,180,35,175,67,151,42,95,58,62,61,27,98" href="main.php" alt="Click here to return Home">
<area shape="poly" coords="55,129,73,108,197,84,232,96,230,116,223,128,195,111,144,129,108,128,77,157" href="news.php" alt="Click here for the latest News.">
<area shape="poly" coords="153,215,149,190,184,169,234,163,283,152,324,167,322,189,313,204,290,185,240,195,190,194,166,226" href="aboutus.php" alt="Click here to learn more About Us.">
<area shape="poly" coords="201,64,203,37,232,24,295,15,351,11,380,28,381,40,371,63,338,40,290,53,246,45,218,71" href="store.php" alt="Click here to enter the Store.">
<area shape="poly" coords="267,150,247,114,283,89,334,91,391,82,429,102,429,120,417,136,385,118,343,125,298,120" href="conspiracies.php" alt="Click here to read about conspiracies.">

</map>
</div>
<div class="titlebanner"><img src="layout/images/main-banner.jpg" alt="Welcome to Conspiracy Brand" width="606" height="99"></div>
<div class="content">
<div class="contenttextbox"><!-- InstanceBeginEditable name="main" -->main<!-- InstanceEndEditable --></div>
</div>

<div class="leftnavcontent">
<table border="0" align="center" cellpadding="0" cellspacing="5">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr>
<td><img src="layout/side/featured.jpg" alt="Featured Item" width="165" height="23"></td>
</tr>
<tr>
<td id="alpha"><img src="images/featured/freedom_haters.png" alt="Freedom Haters" width="165" height="175"></td>
</tr>
</table></td>
</tr>
<!--<tr>
<td><hr class="hr"></td>
</tr>-->

<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="layout/side/didyouhear.jpg" alt="Did you hear?" width="165" height="22"></td>
</tr>
<tr>
<td class="sidedidyouhear">enter crazy conspiracy theory of the month or some random update or whatever you want. </td>
</tr>

</table></td>
</tr>
</table>
</div>
</td>
</tr>
</table></div>
</body>
<!-- InstanceEnd --></html>

Taxgirl
07-13-2006, 04:43 AM
i take that back too

i got it to overflow... but the background-color won't flow as well?

jscheuer1
07-13-2006, 05:10 AM
Um, I dunno what it was that you said but, I'm sure I've been called worse. :cool:

Anyways, that looked like the right height to me working from your example but, it can be changed here:


.container {
position: relative;
top: 0px;
height:870px;
width: 780px;
margin: 0 auto;
overflow:hidden;
}

And you could try removing the overflow:hidden; to see what that gets you. Also, if there were enough content on the page, to fill it out, the height property might not need to be set as content often drives or creates dimension but, not always. For this (content driven height) to work, overflow:hidden; probably would have to be removed. There is something else making the page pretty tall though. Either one or all of the height:100% settings that remain or the cumulative heights of some or all of the other elements. I just tried to give a cross browser example of a way to get the look of the left aligned page when centered. I still can't know for sure what additional content you have planned for the page or where it would go so, I didn't bother trying to figure out how that would work

Taxgirl
07-13-2006, 05:14 AM
I'm sorry, I would like to make it so the content box will fill all of the contents... like... it will always have color running from the top to the bottom... more content, the color continues down the page, but still ends off the screen....

how it is now, it ends at the 870 px mark however when I put the height at 100% the background doesn't work at all.....

http://conspiracybrand.com/aboutus.php

jscheuer1
07-13-2006, 06:43 AM
Setting height:100% is often meaningless to a browser because there are no practical limits to the height of a page. So, if there is a container, it will be 100% the height of the container, if there is no container, it will be unknown. Try this out (I had to take some of the text out to fit the message size limit):


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><!-- InstanceBegin template="/Templates/main2.dwt.php" codeOutsideHTMLIsLocked="false" -->
<head>
<title>Conspiracy Brand</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<base href="http://www.conspiracybrand.com/">
<!-- InstanceEndEditable -->
<style type="text/css">

body {
background-color: #000000;
margin:0;
padding:0;
}
a:link {
color: #999900;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #440001;
}
a:active {
color: #7F7F7F;
}
.toplinks {
position: absolute;
visibility: visible;
height: 296px;
width: 780px;
left: 0px;
top: 0px;
}
.leftnav {
background-color: #000000;
background-image: url('layout/images/p__02.jpg');
background-repeat: no-repeat;
position: absolute;
height: 611px;
width: 174px;
left: 0px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
}
.content {
position: absolute;
width: 606px;
left: 174px;
top: 395px;
clear: both;
}
.titlebanner {
position: absolute;
visibility: visible;
height: 99px;
width: 606px;
left: 174px;
top: 296px;
}
.contenttextbox {
background-image: url('layout/images/p__04.jpg');
background-repeat: no-repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
padding:0 30px;
width: 541px;
position: absolute;
background-color: #393220;
height: auto;
text-indent: 10px;
}
.leftnavcontent {
position: absolute;
visibility: visible;
width: 165px;
left: 5px;
top: 296px;
z-index: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
overflow: visible;
}
.hr {
border: thin solid #440000;
}
.sidedidyouhear {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-variant: normal;
text-transform: uppercase;
font-style: normal;
}

.container {
position: relative;
top: 0px;
width: 780px;
margin: 0 auto;
}

* html #alpha img {
visibility:hidden;
}
* html #alpha a {
position:relative;
width:100%;
height:100%;
z-index:2;
}
* html #alpha {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='http://www.conspiracybrand.com/images/featured/freedom_haters.png', sizingMethod='crop');
}

</style>

<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
</head>

<body><div class="container" id="container"><div class="leftnav" id="LeftNav"></div>
<div class="toplinks" id="TopLinks"><img src="layout/images/p__01.jpg" alt="Navigation" width="780" height="296" border="0" usemap="#Map">
<map name="Map">

<area shape="poly" coords="0,74,45,35,150,10,182,25,180,35,175,67,151,42,95,58,62,61,27,98" href="main.php" alt="Click here to return Home">
<area shape="poly" coords="55,129,73,108,197,84,232,96,230,116,223,128,195,111,144,129,108,128,77,157" href="news.php" alt="Click here for the latest News.">
<area shape="poly" coords="153,215,149,190,184,169,234,163,283,152,324,167,322,189,313,204,290,185,240,195,190,194,166,226" href="aboutus.php" alt="Click here to learn more About Us.">
<area shape="poly" coords="201,64,203,37,232,24,295,15,351,11,380,28,381,40,371,63,338,40,290,53,246,45,218,71" href="store.php" alt="Click here to enter the Store.">
<area shape="poly" coords="267,150,247,114,283,89,334,91,391,82,429,102,429,120,417,136,385,118,343,125,298,120" href="conspiracies.php" alt="Click here to read about conspiracies.">
</map>
</div>
<div class="titlebanner" id="TitleBanner"><!-- InstanceBeginEditable name="title" --><img src="layout/images/about.jpg" alt="Welcome to Conspiracy Brand" width="606" height="99"><!-- InstanceEndEditable --></div>
<div class="content" id="Content">
<div class="contenttextbox" id="contenttextbox"><!-- InstanceBeginEditable name="main" -->

<p>Thank you for visiting Conspiracy Brand. You probably wouldn't be here unless you had that deep down feeling that something was wrong. You may have had the feeling that the &quot;official&quot; story just didn't make sense to you. You are not alone. There are millions of people around the world at this very moment that feel the same way as you or me. </p>
<p> Standing on the corners preaching to the masses about the injustices and cover-ups will only get you ridiculed and scoffed at. It often becomes a touchy situation when a couple of people, or even a group of people begin to discuss topics including politics, corporations, fascism, or war. Often times when the idea is presented that a conspiracy is afoot, hidden in plain site from all that don&rsquo;t believe it could be possible, sparks start to fly.</p>
<p> At this point in history, we have access to more information than ever before, and at an even faster rate. The trick is, when reading through all of the information in books and on the web, to find out what &quot;feels&quot; right to you, and distinguish it from the speculation, lies, and disinformation. It may be time for you to stand up and let them know that you don't buy the lie. We hope that the information and links on this site lead you to finding some of the answers you are looking for. This site is for information pertaining to the version of truth we see laid out before us. If you don't agree, go watch TV.</p>
<p>Conspiracy Brand</p>
<p>&nbsp;</p>
<p>Thank you for visiting Conspiracy Brand. You probably wouldn't be here unless you had that deep down feeling that something was wrong. You may have had the feeling that the &quot;official&quot; story just didn't make sense to you. You are not alone. There are millions of people around the world at this very moment that feel the same way as you or me. </p>

<p> Standing on the corners preaching to the masses about the injustices and cover-ups will only get you ridiculed and scoffed at. It often becomes a touchy situation when a couple of people, or even a group of people begin to discuss topics including politics, corporations, fascism, or war. Often times when the idea is presented that a conspiracy is afoot, hidden in plain site from all that don&rsquo;t believe it could be possible, sparks start to fly.</p>
<p> This usually comes down to a firm stance on one side, completely oblivious to the wealth of information to disprove the lie they have been lead to believe since early schooling. From their lips will be the phrases &ldquo;show me what proof you have&rdquo; and &ldquo;here comes another conspiracy theory&rdquo;, as if to say that nothing you state has any merit and is all completely fiction until proven fact by themselves. On the other side, the more open minded conscious individual that hears what the mainstream media is pushing on them, only to go in search of what they feel is the real truth. This person will enjoy the search, trying to put all of the puzzle pieces together and get to the bottom of it all. This is a fun, yet never-ending journey</p>
<p> At this point in history, we have access to more information than ever before, and at an even faster rate. The trick is, when reading through all of the information in books and on the web, to find out what &quot;feels&quot; right to you, and distinguish it from the speculation, lies, and disinformation. It may be time for you to stand up and let them know that you don't buy the lie. We hope that the information and links on this site lead you to finding some of the answers you are looking for. This site is for information pertaining to the version of truth we see laid out before us. If you don't agree, go watch TV.</p>

<p>Conspiracy Brand</p>
<!-- InstanceEndEditable -->
<div class="bottom" id="bottom">
<div align="center"><br>
<br>
<img src="layout/images/bottom.jpg"><br>
Home | News | Store | About Us | Conspiracies | Links | Myspace <br>
<br>

<br>
</div>
</div>
</div>
</div>

<div class="leftnavcontent" id="leftNavcontent">
<table border="0" align="center" cellpadding="0" cellspacing="5">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr>
<td><img src="layout/side/featured.jpg" alt="Featured Item" width="165" height="23"></td>
</tr>
<tr>
<td id="alpha"><img src="images/featured/freedom_haters.png" alt="Freedom Haters" width="165" height="175"></td>
</tr>
</table></td>
</tr>
<!--<tr>
<td><hr class="hr"></td>
</tr>-->

<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="layout/side/didyouhear.jpg" alt="Did you hear?" width="165" height="22"></td>
</tr>
<tr>
<td class="sidedidyouhear">enter crazy conspiracy theory of the month or some random update or whatever you want. </td>
</tr>

</table></td>
</tr>
</table>
</div>
</div>
</body>
<!-- InstanceEnd --></html>

Taxgirl
07-13-2006, 07:14 AM
John,

I thank you, sir.

Very, very kindly.


Thank you.


Now the question is, is there a way to default it so that the color always fills the page?

Example of it not filling all the way: http://www.conspiracybrand.com/conspiracies.php

~beth.

jscheuer1
07-13-2006, 08:06 AM
For that, you would want to set a minimum height. This is done using min-height: in most browsers but IE is different. The way IE does it requires that javascript be enabled but fortunately, most folks do. Make your contenttextbox declaration look like so:


.contenttextbox {
background-image: url('layout/images/p__04.jpg');
background-repeat: no-repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
padding:0 30px;
width: 541px;
position: absolute;
background-color: #393220;
min-height:520px;
height: auto;
text-indent: 10px;
}
* html .contenttextbox {
height:expression(Math.max(this.offsetHeight, 520)+'px');
}

Both 520's can be whatever you like but, 520 seemed about right.

jscheuer1
07-13-2006, 08:13 AM
My previous post answered your question but, notice this in the markup from my demo:


<td id="alpha"><img src="images/featured/freedom_haters.png" alt="Freedom Haters" width="165" height="175"></td>

It, along with the #alpha style I added, makes your .png work in IE.

Taxgirl
07-22-2006, 04:44 AM
Hey! Okay... so I was cross browser checkin and on a Mac in Internet Explorer, the backgrounds dont show, they only soild color fill... any ideas???


(ps. thank you for all your help so far! amazing!)

jscheuer1
07-22-2006, 05:10 AM
If IE Mac doesn't support the alpha image and you want IE Mac to at least show it the way it was with the alpha channel transparency as white, you can take this out of the stylesheet:


* html #alpha img {
visibility:hidden;
}
* html #alpha {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='http://www.conspiracybrand.com/images/featured/freedom_haters.png', sizingMethod='crop');
}

and add this to the page itself:


<!--[if gte IE 5.5]>
<style type="text/css">
* html #alpha img {
visibility:hidden;
}
* html #alpha {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='http://www.conspiracybrand.com/images/featured/freedom_haters.png', sizingMethod='crop');
}
</style>
<![endif]-->

If you want to keep the style in the stylesheet, this is supposed to hide it from IE Mac:


/*

\*/
* html #alpha img {
visibility:hidden;
}
* html #alpha {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='http://www.conspiracybrand.com/images/featured/freedom_haters.png', sizingMethod='crop');
}
/*

*/

If you are talking about backgrounds in general, IE Mac is just screwy and it was probably like that before.

Taxgirl
07-22-2006, 05:16 AM
I'm sorry, I'm not talking about the image on the left side, I'm talking about the actual background of the div layers.

the png displays properly, just not the div backgrounds.

jscheuer1
07-22-2006, 05:28 AM
I just looked in IE Mac 5.2 and the freedom haters image did not show up but the bg images looked fine, that was for main.php. The only problem with the backgrounds in general was that the main area (below where you currently have the bit about 'this is the main page you . . .') looked content driven as far as its height was concerned. I really wouldn't worry too much about IE Mac though, unless your text is illegible or your links don't work.

Taxgirl
07-22-2006, 05:35 AM
Cool!

Thank you very much with all of your help!
~beth.

jscheuer1
07-22-2006, 05:37 AM
One thing that may or may not help in IE Mac would be to hide this:


* html .contenttextbox {
height:expression(Math.max(this.offsetHeight, 520)+'px');
}

from it using one of the two methods I outlined for hiding the #alpha styles from it.