Never thought possible but, 3 browsers, 3 different problems

[XraySierra]

I just launched my company's new website (www.xraysierra.com - small web design firm in a Northern town). I tried the framework on all browsers and it seemed to work but somewhere in the design process we must have broke the code. Opera, IE7 and IE6 all have 3 different problems (works in FireFox like always, FF RULES!!!)

IE7 Problem:

• only real problem is the flash and flash menu have this selection border around it which I don't like. It almost looks like it's preselected or something
• Another problem was we had to change
  
  body { padding-right: 40px;} to
  
  html { padding-right: 40px;}
  
  Hopefully there is a way to fix this so I can do away with the dual properties

IE 6 Problems:

• When you first load the site two security messages pop-up asking if you want to load the content
• The header doesn't load some of the background and the bottom line doesn't go accross the entire header that seperates the header from rest of content
• The side menu is badly spaced out and when you hover over it, the color goes white
• There is a horizontal scroll as if it's not taking the padding-right: 40px; on the html tag

Opera Problems:

• The header background loads roughly 15px or so from the top which as you can see messes with the design since the flash loads on level fine.

I know this is a lot of problems and I appreciate any and all help. Thank you very much, I look forward to your replies and input.

[Tyssen]

The Flash problem with IE7 is because of changes MS had to make to counter the EOLAS suit. Read more about it:
http://www.sitepoint.com/article/act...ation-issue-ie
with another alternative solution:
http://blog.deconcept.com/swfobject/

[Tyssen]

For IE6, I'm not getting security messages.

For the spacing of your menu you need to add height: 1% to trigger hasLayout (this is for IE only so you should either use a hack or an IE-only stylesheet served up with conditional comments).

Not sure about the horizontal scrollbar but it seems to me that instead of using the hacked up Holy Grail method you're using, that your layout is a perfect example of when Faux Columns would be an ideal, simple solution.
You also really could do with using some CSS shorthand so that this:

 .blog_men a	{
 	display: block;
 	padding-bottom: 8px;
 	padding-top: 8px;
 	padding-left: 20px;
 	text-decoration: none;
 	border-top-width: 0px;
 	border-right-width: 0px;
 	border-bottom-width: 1px;
 	border-left-width: 0px;
 	border-top-style: dashed;
 	border-right-style: dashed;
 	border-bottom-style: dashed;
 	border-left-style: dashed;
 	border-top-color: #CCCCCC;
 	border-right-color: #CCCCCC;
 	border-bottom-color: #CCCCCC;
 	border-left-color: #CCCCCC;
 	color: #666666;
 }

becomes this:

 .blog_men a	{
 	display: block;
 	padding: 8px 0 8px 20px;
 	text-decoration: none;
 	border-bottom: 1px dashed #CCC;
 	color: #666;
 }

[XraySierra]

I definatley understand the flash problem now and will be fixing that later for sure. I put in the height: 1% and the spacing did get better but not compeley. There is still some larger spacing on the menu, but the hover over works.