TheFilmGod Posted October 28, 2007 Share Posted October 28, 2007 Hey, I just created a new layout for my site. --> beastit.com If you check it out in Firefox, it works great! Now check it out in internet explorer... ARG!!!. In IE 6 the footer's background vanishes! And the center area has a horrible background! It is suppose to fade to the color, but instead it skips to the color and creates a bad look. I attached a screen shot! ---> For the background problem in the center I was hoping someone can help me set in an If clause in the CSS where it states, "IF not internet explorer 6 or below show the nice gradient, otherwise show a static background color." ---> For the footer, how do I fix the problem? [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
wildteen88 Posted October 28, 2007 Share Posted October 28, 2007 I guess for the background you're using a transparent png image. I believe IE6 had issues with transparent png images. Perhaps a gif may work better. As for the footer I'm not sure. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted October 28, 2007 Author Share Posted October 28, 2007 Actually I solved the problem. No, I wasn't using a transparent png. I was using a default background color with a background picture at the top. Once the gradient went down enough the background color would kick in. Anyway, I fixed the footer by giving it a declared height. For the background, I simply made a conditional in the css, where IE6 and below would use a different background color. It seems to fade in better. Anyway, Thanks for all you help! Quote Link to comment Share on other sites More sharing options...
calabiyau Posted October 28, 2007 Share Posted October 28, 2007 I'm looking in IE 6 and there is still a noticeable change in color between the top and bottom of the main section. Every moniter will look slightly different though. I've run into this problem many times, as it seems photoshop image file of your end point of your gradient does not always correspond to the browser's interpretation of the color, when you tell it to color something. Sometimes it happens with firefox, sometimes with IE. Maybe try doing your gradient image in your editor, but only make the gradient run maybe 90% of the height and fill in the rest with the color of the end point of the gradient. Use that image as you are right now. Then crop the image on the last 10% and use that image to fill the body element. Assuming all the layers on top of the body element will have some color or image, it should work to provide a seamless transition from gradient to final color. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted October 28, 2007 Author Share Posted October 28, 2007 Sounds good, but how in terms of coding is that possible? I don't want two separate divs, and you cannot specify more than one background image in a div. So your way does not work... unless I am wrong? EDIT: Can you post a screen shot of what you get? And what version of IE are you using? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.