dlederman Posted February 7, 2012 Report Posted February 7, 2012 First, thanks to everyone who responded last week and for the very helpful input. Here's another question: My site is divided into frames (horizontal 93%/7% split). The bottom (7%) is a menu/navigation bar that stays constant. All works well in IE 8, Chrome, Firefox, and Safari. However, when viewed in IE 7 the bottom frame is compressed so that it is too narrow to see the links and in fact is hardly visible at all. IE7 does add a scroll bar at the right, but the effect is ruined and the navigation ability is at best compromised but is really lost. It's important to make this work because a lot of the people I want to reach use IE7. Can anyone suggest a way to eliminate this and get IE 7 to display the site the way it is intended? Obviously, without screwing up the depiction in the other browsers.
Wickham Posted February 7, 2012 Report Posted February 7, 2012 (edited) First of all, I think you should move away from framesets and frames which are intensely disliked by web developers and are bad for SEO. They are almost completely out of date. Use divs and use position: fixed; bottom: 0; for the footer or use a "sticky footer" http://www.cssstickyfooter.com/ However, if you want to continue with the frames, you could try a conditional comment which only targets IE7 with a higher bottom frame (say 10%) and put the conditional comment in the frameset file. I've no idea whether this will work as I've never put one in a frameset, but it might. See http://www.javascriptkit.com/howto/cc2.shtml for conditional comments. Edit: I've just done a quick test with this code whick makes the bottom frame higher only in IE7:- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta name="keywords" content="Wickham, HTML, CSS"> <meta name="description" content="HTML and CSS Tutorial with examples"> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>Framesets</title> </head> <frameset rows="93%, 7%"> <!--[if ie 7]> <frameset rows="83%, 17%"> <![endif]--> <noframes><body><p>Your browser doesn't support frames</p></body></noframes> <frame src="collieindex120119.html"> <frame src="kon120126.html" name="footer"> </frameset> </html> There does seem to be some spare space at the bottom of the IE7 window. The 83% and 17% don't use 100% of the height. I've tested on a IE7 computer and it's the same as using an IE9 computer with IE7 development tools so I think it's an IE7 quirk. <frameset rows="83%, *"> has the same result. Edited February 7, 2012 by Wickham
dlederman Posted February 9, 2012 Author Report Posted February 9, 2012 Thank you for the advice and suggestions. I tried the conditional IE comment and it improved things but not enough. I am sure the issue is with IE. The sticky footer was not exactly the look I am after but it may be useful in the future. I took your advice and am eliminating the framesets in favor of divisions. All is working well and the site displays well in IE, at least as I am developing it. One question: using divs I can create a footer with fixed position in the html file for the page. I have an external style sheet that styles, among other things, the look of links. I want the links in the footer to look different from the rest of the page. I have tried to achieve this with inline styling and adding the link attributes to the external style sheet. Neither one works but there must be a way. First of all, I think you should move away from framesets and frames which are intensely disliked by web developers and are bad for SEO. They are almost completely out of date. Use divs and use position: fixed; bottom: 0; for the footer or use a "sticky footer" http://www.cssstickyfooter.com/ However, if you want to continue with the frames, you could try a conditional comment which only targets IE7 with a higher bottom frame (say 10%) and put the conditional comment in the frameset file. I've no idea whether this will work as I've never put one in a frameset, but it might. See http://www.javascriptkit.com/howto/cc2.shtml for conditional comments. Edit: I've just done a quick test with this code whick makes the bottom frame higher only in IE7:- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta name="keywords" content="Wickham, HTML, CSS"> <meta name="description" content="HTML and CSS Tutorial with examples"> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>Framesets</title> </head> <frameset rows="93%, 7%"> <!--[if ie 7]> <frameset rows="83%, 17%"> <![endif]--> <noframes><body><p>Your browser doesn't support frames</p></body></noframes> <frame src="collieindex120119.html"> <frame src="kon120126.html" name="footer"> </frameset> </html> There does seem to be some spare space at the bottom of the IE7 window. The 83% and 17% don't use 100% of the height. I've tested on a IE7 computer and it's the same as using an IE9 computer with IE7 development tools so I think it's an IE7 quirk. <frameset rows="83%, *"> has the same result.
Andrea Posted February 9, 2012 Report Posted February 9, 2012 http://www.csstutorial.net/2010/03/styling-different-links-differently-with-css/
dlederman Posted February 9, 2012 Author Report Posted February 9, 2012 Thanks very much. Exactly what I needed. http://www.csstutorial.net/2010/03/styling-different-links-differently-with-css/
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now