Hey all, I am trying to create a drop shadow effect on a 2-column layout I have centered on the page, using this hint from ALA. I also made some changes to the page to try and get png graphics to show up in IE. This has somehow resulted in some issues that I can't figure out what is going wrong.
Since I'm not sure which piece of code is messing up, I recommend looking at the page here. If you look at it in FireFox, you can see a couple of issues.
I can no longer get the banner image to move to the left. I am not sure why I've lost this functionality.
Notice that the "container element"—which should span the banner, center content, and right columns completely—only extends about 60px below the banner image.
The frustrating part is that there are other issues in other browsers. In Safari and OmniWeb , for some reason,
content that should be in the right column (e.g. "AECT weblogs", "Member Blogs", "TED archives", and "Recent entries") is in the center column.
some (not all) of the formatting is not rendering
notice that the "content" div does extend all the way to the bottom.
IE has its own problems
For some reason, the content in the right column is now too large to be displayed there (it used to look just fine).
IE is the only browser that is moving the banner as I asked it to (which I am dubious about, since IE is usually the culprit and not the good kid)
I am baffled as to what is causing which problems and which browser to believe. I don't like to leave my questions so open, but I can't figure out why in the world I can't move my banner and why the container div doesn't span the entire thing it's containing. Any help is appreciated.