Main

Monday, October 29, 2007

Fixed Position Problems in IE

I spent a few days last week creating a website for the Junee Rhythm 'n Rail Festival and was so proud of the site I couldn't wait to give the organisers a demonstration.

First, the ' entity showed the code and not the apostrophe! Talk about frustrating. The site viewed beautifully when I made it using Firefox, and worked fine when I showed it off at work using Internet Explorer 7. When viewed in older versions of IE, however, the page wouldn't scroll.

The website relies heavily on CSS techniques, and is based on Stu Nicholl's Holy Grill frame emulation model, modified to include even more fixed elements. After searching for some hacks to fix the problem, and downloading an installer for multiple versions of IE, I think I've fixed the site so it plays as it was meant to.

Let me know if it doesn't look right in your browser.

Sunday, May 20, 2007

Easy Text Decoration

I don't know what you use to enter your posts, but on my entry screen there is no button for strikethrough.

Don't depair: there's an easy way to overcome this with a simple text decoration style.

A line of text using strikethrough called line-through.

<p style="text-decoration: line-through;">A line of text using strikethrough 
called line-through.</p>

How about a line above your text for something different. It's the opposite of underline: overline.

A line of text with the line above called overline.

<p style="text-decoration: overline;">A line of text with the line above  
called overline.</p>

Blinking text is something I never think to use, and it is so easy. To really grab someone's attention, this text decoration is a winner.

These styles are easy to remember because they are named by what they do. Remember: blink, overline, underline, and line-through.

<p style="text-decoration: blink;">These styles are easy to remember 
because they are named by what they do. Remember: blink, overline, underline, 
and line-through.</p>

Blinking text is really quite annoying so I wouldn't recommend using this one too often.

Another way to make your text stand out would be to use the Font Variant style, Small Caps.

A line of text using the font variant style,Small Caps.

<p style="font-variant: small-caps;">A line of text using the font 
variant style, Small Caps.</p>

Friday, September 15, 2006

Preparing Your Site for Internet Explorer 7

I've talked about this before and it won't be long before everyone who uses Internet Explorer version 6 will upgrade to version 7. Your websites, and mine, will not look how they should and tweaks that you've implemented for IE will no longer be necessary.

According to Kevin Yank in a recent issue of the SitePoint Tech Times:

"Word on the street is that, upon its release (before year's end), IE7 will be pushed out as a forced update to Windows XP users everywhere, as was done for Service Pack 2. The move to IE7 among the end-user masses will not be a gradual migration, but a sudden and significant shift.”

What's different about IE7?

From a user's perspective, improvements include tabbed browsing, better printing, RSS feed integration, more advanced searching, and better security features, as well as a plethora of add-ons to enhance the user experience (similar to Firefox extensions).

However, the most important changes that will have a more direct impact on how your site is loaded and displayed are:

RSS integration – IE7 automatically detects RSS feeds and asks you to subscribe. It also gives you the option to have IE7 auto-check for feed updates (even when it's not running). Is your feed properly recognized by IE7?

Updated CSS behavior – the IE7 team worked very closely with the W3C workgroup to ensure standards compliance. They made over 200 changes from IE6 to become compliant with CSS2.1. Even if your site is standards compliant, it may not be rendered exactly the same as it is in IE6 or Firefox.

AJAX XMLHTTP Request changes – the IE blog states: “to have your cross-browser AJAX work better with IE7, you really should be invoking the native XMLHttpRequest (the cross-browser one) first to see if it’s available before instantiating the ActiveX control, instead of the other way around.

Added security features – everything from more secure SSL defaults to disabling most Active X controls by default has been changed to help make the user's browsing experience more secure. These changes could drastically change your users browsing and purchasing experience.

You can get full details on all of the changes by visiting the IE Blog.

What should you do?

The only way to know for sure how your site will work in Internet Explorer 7 is to download it and try. The IE7 team recently released Internet Explorer 7 Release Candidate 1 (RC1), which can be downloaded on the Internet Explorer web site. I'd recommend downloading IE7 on a computer other than your primary machine (you still want IE6 on your primary machine at least until IE7 is officially launched). RC1 is essentially the final version of how IE7 will display sites when launched, so if your site passes the test now you'll likely be OK when IE7 is released for real.

In testing my sites there were a few instances where my site worked flawlessly in Firefox and IE6, but had small problems in IE7. The changes I needed to make were minimal, but regardless of how well you code there could still be some potential problems. It's better to find and fix them now than to wake up one morning and have hundreds of complaints!

About This Author
Adam McFarland owns iPrioritize - web based to-do lists that help people and businesses organize their tasks. Email, print, check from your mobile phone, subscribe via RSS, and share with others.

Friday, August 11, 2006

Getting Ready for IE7

According to Trenton Moss, in an article at The Code Project, IE 7 will be released later this year and we'd better be ready. If you're like me and have hacks for IE in the CSS, you probably need to follow some of Trenton's advice for preparing your website.

The article goes on to say:

Internet Explorer 7 will understand the child selector
Historically, one of the easiest ways of hiding CSS rules from Internet Explorer is to use the child selector. To date, Internet Explorer hasn't understood the child selector so will totally ignore any CSS rule that uses it. Internet Explorer 7 will however understand the child selector.

The child selector command involves two elements, one of which is the child of the other. So, html>body refers to the child, body, contained within the parent, html.

If you wanted to send a different width value to IE than to other browsers, you could have used the following:

#foo {width: 400px;}
html>body #foo {width: 300px;}

Historically, the first CSS rule would have been just for IE and the second for every other browser. Now, the first CSS rule is for IE6 and previous versions and the second for IE7 and non-IE browsers.

read more »


September 2008

Sun Mon Tue Wed Thu Fri Sat
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30

Subscribe

Enter your Email


Preview | Powered by FeedBlitz
The Playground

DreamHost

GeoURL


Google AdSense

Creative Commons License
This weblog is licensed under a Creative Commons License.