WeLoveCSS Logo
Home Profile Members Search Rules Help New Posts



WeLoveCSS > WEB DESIGN > Browser Compatibility > [SOLVED] Making my site IE7 compatible.

Reply
  Thread Tools Display Modes
Old 21st June 11, 05:20 PM   #1
jmayoff
WLC Member
 
Join Date: Jun 2011
Posts: 16
Default Making my site IE7 compatible.

I'm about to start working on making my site work properly in IE7. I haven't really begun yet, but does anyone have any suggestions as to where to start.

The problem appears to be with the menu which is black and goes off the screen on the right -- and the main-content divs on non-front page pages, which jump up to the top of the page.

Thanks, and I'll probably be back to ask some questions once I dive in over the next few days.

http://server51.dayanadns.com/~wicawica/volunteer/

Thanks,
/j
jmayoff is offline   Reply With Quote
Old 22nd June 11, 02:16 AM   #2
Phreaddee
WLC Lover
 
Phreaddee's Avatar
 
Join Date: Oct 2010
Location: Newcastle, NSW, Australia
Posts: 768
Default Re: Making my site IE7 compatible.

I like to use this...
http://code.google.com/p/ie7-js/

its not perfect but irons out a fair bit of IE's annoying quirks.
Phreaddee is offline   Reply With Quote
Old 22nd June 11, 03:00 AM   #3
jmayoff
WLC Member
 
Join Date: Jun 2011
Posts: 16
Default Re: Making my site IE7 compatible.

Quote:
Originally Posted by Phreaddee View Post
I like to use this...
http://code.google.com/p/ie7-js/

its not perfect but irons out a fair bit of IE's annoying quirks.
Thanks. I'll give it a try.
jmayoff is offline   Reply With Quote
Old 22nd June 11, 04:16 PM   #4
jmayoff
WLC Member
 
Join Date: Jun 2011
Posts: 16
Default Re: Making my site IE7 compatible.

Most of my problems were solved by removing the #s I used to comment out items in my stylesheet. Not sure why I even did it, but while most other browsers just ignored the #s, ie7 pretended the # wasn't there and just did the clear:both or margin-left: 500px anyway.

Here's an example of what I mean:

Code:
#front-page-right-pic{
	float: right;
	font-size: 10px;
	font-style:italic;
	width: 277px;	
	#margin-right: 30px;
	margin-bottom: 15px;
}
In this case, most browsers would ignore the

Code:
#margin-right: 30px;
while IE7 executed it.

My only other problem (the main-content div sitting at the top of the page) was fixed by removing an extraneous clear:both.

Easier than I thought it might be.

BTW: I figured out exactly where to start looking for problems with margins, by process of elimination. I deleted the divs that I thought were causing horizontal scroll bars to appear and when I found the scrollbars disappeared, I knew where to look in the CSS for the problem.
jmayoff is offline   Reply With Quote
Old 22nd June 11, 05:44 PM   #5
Phreaddee
WLC Lover
 
Phreaddee's Avatar
 
Join Date: Oct 2010
Location: Newcastle, NSW, Australia
Posts: 768
Default Re: Making my site IE7 compatible.

and removing such #'s should fix the errors because...
Code:
/* this is a css comment */
whilst
Code:
#this is an error.
what you are essentially doing is making an id called #margin-right
but because this is within another's style, it reads it as an unclosed style.
the #margin-right it then reads as invalid as there would be no { after it.
I'm surprised that any of those sections would work.
remember
Code:
/* this is a css comment */
not
Code:
#definitely not a comment
Phreaddee is offline   Reply With Quote
Old 22nd June 11, 06:16 PM   #6
jmayoff
WLC Member
 
Join Date: Jun 2011
Posts: 16
Default Re: Making my site IE7 compatible.

Quote:
Originally Posted by Phreaddee View Post
remember
Code:
/* this is a css comment */
not
Code:
#definitely not a comment
I guess I knew that, but # worked for the most part before so I just figured it was a one line comment, the way // is in some languages. A one-line comment like that would be convenient in CSS.
jmayoff is offline   Reply With Quote
Reply


Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 12:58 PM.



Home | Advertise | Contact Us | Top
Home | Advertise | Contact Us | Top

Copyrightę 2006 WeLoveCSS.com. All Rights Reserved.
Powered by vBulletin Version 3.8.4 Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.