943,960 Members | Top Members by Rank

Ad:
Mar 22nd, 2009
0

All colors drastically different in IE

Expand Post »
I have designed my page using Firefox and it looks exactly as I would expect it to, colors consistent with my design using Photoshop. When I view the page in Internet Explorer, all the colors are changed. It looks as if everything has a slight gray layer over it making it look dreary and "gross." Even the background image looks very different, it is lighter and brown-ish. The transparency I applied doesn't have any effect (yes, I added the IE "filter" property for alpha-opacity). The CSS I have added (in addition to the existing myspace styles) is here:
CSS Syntax (Toggle Plain Text)
  1. <style type="text/css">
  2. .bodyContent
  3. {
  4. background-color: 1e190c;
  5. background-image: url('http://img15.imageshack.us/img15/706/58119117.jpg');
  6. background-position: center;
  7. background-repeat: repeat-y;
  8. filter: alpha(opacity=80);
  9. opacity: 0.8;
  10. }
  11.  
  12. .bodyContent a, .bodyContent a:link, .bodyContent a:active, .bodyContent a:visited
  13. {
  14. color: ffffff;
  15. text-decoration:
  16. underline;
  17. }
  18. .bodyContent a:hover
  19. {
  20. color: ff6600;
  21. }
  22.  
  23. .bodyContent br
  24. {
  25. line-height: 20px;
  26. }
  27.  
  28. .bodyContent table
  29. {
  30. border-style: solid;
  31. border-color: ffffff;
  32. border-width: 0px 1px 0px 1px;
  33. background-color: 3c0909;
  34. }
  35. .bodyContent table table table td
  36. {
  37. border-width: 0px;
  38. }
  39. .bodyContent table table table table
  40. {
  41. border-spacing: 1px;
  42. }
  43. .bodyContent table[id="headerTable"] td
  44. {
  45. background-color: 2358b8;
  46. }
  47. .bodyContent table[id="musicJVNav"] td
  48. {
  49. background-color: transparent;
  50. }
  51.  
  52. .bodyContent tr, .bodyContent td, .bodyContent table table, .bodyContent table table td
  53. {
  54. color: ffffff;
  55. border-width: 0px;
  56. background-color: transparent;
  57. }
  58.  
  59. .bodyContent table table table table table strong
  60. {
  61. color: ffffff;
  62. }
  63. .bodyContent table table table table
  64. {
  65. border-width: 0px;
  66. background-color: transparent;
  67. padding: 0px;
  68. margin: 0px;
  69. background-image: none;
  70. }
  71. .bodyContent table table table table td
  72. {
  73. padding: 0px;
  74. margin: 0px;
  75. }
  76. .bodyContent table table table
  77. {
  78. width: 100%;
  79. margin: 0px;
  80. background-color: 232223;
  81. border-width: 1px;
  82. border-color: FFFFFF;
  83. }
  84.  
  85. .bodyContent table.friendSpace
  86. {
  87. display: none;
  88. }
  89.  
  90. .bodyContent .text, .bodyContent .text font
  91. {
  92. background-color: transparent;
  93. color: FFFFFF;
  94. }
  95. .bodyContent .nametext
  96. {
  97. background-image: url('http://img6.imageshack.us/img6/479/thefallcontinent.png');
  98. width: 300px;
  99. height: 100px;
  100. display: inline-table;
  101. font-size: 0px;
  102. }
  103. </style>

I have screen shot of what I am talking about:
Firefox: http://img257.imageshack.us/img257/6490/shotff.jpg
IE: http://img21.imageshack.us/img21/1043/shotie.jpg
Last edited by death_oclock; Mar 22nd, 2009 at 8:33 pm.
Similar Threads
Reputation Points: 128
Solved Threads: 43
Posting Whiz
death_oclock is offline Offline
389 posts
since Apr 2006
Mar 23rd, 2009
-1

Re: All colors drastically different in IE

this always happen. i have the same problem as well. sometimes it works in firefox then in ie its not. its really frustrating.
Reputation Points: -30
Solved Threads: 10
Junior Poster
Jen0608 is offline Offline
179 posts
since May 2008
Mar 23rd, 2009
0

Re: All colors drastically different in IE

i understand your frustration with the limitations on coloring it exactly the way you want to on the web! the problem comes in that most users browsing these websites would most probably be using IE, so it's always easier desinging for IE and then adding your add ons for FireFox via CSS.

you are also referencing opacity twice in your first CSS reference, which could be a problem, always try and limit it to only one reference in a table and adjust your image to what you really want.
Reputation Points: 13
Solved Threads: 18
Junior Poster
MJ Pieterse is offline Offline
144 posts
since Mar 2009
Mar 23rd, 2009
0

Re: All colors drastically different in IE

Firefox has beaten out IE (thankfully) but there is still too large a demographic of IE users to just ignore. Opacity hasn't quite caught on as standard yet (I doubt anything will for IE) so the first definition is just for IE, the second for most other browsers. And I haven't had this problem designing other sites before, this is the first time I've seen something so blatantly broken by a specific browser.
Last edited by death_oclock; Mar 23rd, 2009 at 9:45 pm.
Reputation Points: 128
Solved Threads: 43
Posting Whiz
death_oclock is offline Offline
389 posts
since Apr 2006
Mar 24th, 2009
0

Re: All colors drastically different in IE

Did you forget to close a tag in the html?
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Mar 25th, 2009
0

Re: All colors drastically different in IE

I am modifying a myspace page so the only tag I added is the <style> tag shown above.
Reputation Points: 128
Solved Threads: 43
Posting Whiz
death_oclock is offline Offline
389 posts
since Apr 2006

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: Creating interactive form in MS Word and Email it
Next Thread in HTML and CSS Forum Timeline: Table columns are sequeezed





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC