ArtsAutosBooksBusinessEducationEntertainmentFamilyFashionFoodGamesGenderHealthHolidaysHomeHubPagesPersonal FinancePetsPoliticsReligionSportsTechnologyTravel

Do Web Designers Just Want To Yell At Microsoft For Creating Problems With Internet Explorer?

Updated on November 15, 2012

I am writing this hub in response to the Hub Pages member ChristinS who had a question that she could not get a beautiful website that looks great in Google Chrome and Mozilla Firefox, but the navigation fails to display well in Internet Explorer. I responded to the question asking Christin what version of Internet Explorer.

Well Christin, you are definitely not alone. You will be happy to know that most web designers complain about the bugs created by Microsoft for causing issues with Internet Explorer and creating more work for web designers to test their work and make corrections to HTML, CSS and jQuery. Furthermore, HTML 5 tags do not work and CSS 3 properties are also not working well in Internet Explorer.

Well, my fellow webmasters, do not blame Microsoft. It is not their fault and in 2007 when HTML5 and CSS 3 were hardly used or even published, they worked just fine.

Who Do You Really Blame This On?

  1. Do you blame it on the web surfers who are suffering because of the economy and do not have the money to upgrade their computers to a new one with Internet Explorer 9?
  2. Do you blame it on the web surfers who are not technical and do not know how to download a new web version of a simple web browser. Stop laughing, you guys!
  3. Do you blame it on the technology for leaving web browsers like Internet Explorer 7 and 8 in the dark?
  4. Do you blame it on Microsoft???
  5. Do you blame it on web designers for not keeping up with the technology and should know how to make their work available for ALL web browsers regardless?

Well, I am sure everyone reading this has different answers to that question depending on who they are. You could blame Microsoft, but then again, websites on those older browsers looked fine before all this great web technology like jQuery and CSS 3, so don't blame them.

My theory is that Microsoft tried to change the world with something other than Windows:

Why do I think this? Microsoft came out with Jscript when the rest of the world was using Javascript. Remember JScript? Microsoft came out with DHTML. That reigned for some time, but jQuery and other Javascript libraries crushed DHTML, because it was too hard to use and reference HTML elements. And finally, they came out with their own version of CSS, but most web designers just said Microsoft did it wrong. Hey, you cannot fault a company for thinking out of the box and trying to dominate the world. Apple did it successfully with some crazy device where you loaded MP3s and tucked it into your pocket. I think that was called the ipod, but I don't remember. It was so long ago. LOL

The fact remains that we, as web designers, must make our websites look good on all browsers. Otherwise, you will have an irrate client who happens to be one of those cheap, non-technical users with the dreaded, yup you guessed it, internet explorer 7. Hey, I still have Internet Explorer 7 on one of my PCs and Internet Explorer 9 on another. Mostly likely, if it does not look good on IE 8, it won't on 7 for sure.

Ok, so how do you really solve this issue with Internet Explorer? You need an Internet Explorer CSS style sheet!!!

To this day, most web design firms are not taking advantage of this and their websites look horrible on Internet Explorer.


This is from my HTML <HEAD> tags

<link rel="stylesheet" type="text/css" media="all" href="style.css" />

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="/ie.css" />
<![endif]-->

In the first line, I call my regular style.css file. It works for ALL browsers including Internet Explorer 7, 8 and 9. Google Chrome, Firefox, Safari, Opera will all see this CSS and bind with your HTML.

The second line is telling your web browser to load an additional CSS file if any version of Internet Explorer less than 9 is detected. All you need to do in this ie.css file is change the styles that do not work. You don't need to load your entire style.css file. This will override any CSS from style.css that it encounters when your website visitors use IE 7 or 8.

My CSS styles that do not work in IE 7 or IE8

h2.widgettitle
{
	color:#f7941e;
	font-family:georgia, serif;
	font-size:14pt;
	margin-left:7px;
}

.widget_archive a
{
	color:#94bc3d;
	text-decoration:none;
	font-family:century gothic, serif;
	margin-left:-30px;
}

section.blog-section
{
	font-size:10pt; border-radius:10px; margin: 0px 0 30px 35px; padding:0px;
}

My entire ie.css file

h2.widgettitle
{
	color:#f7941e;
	font-family:georgia, serif;
	font-size:14pt;
	margin-left:-10px;
	margin-top:10px;
}

.widget_archive a
{
	color:#94bc3d;
	text-decoration:none;
	font-family:century gothic, serif;
	margin-left:-30px;
}

section.blog-section
{
	font-size:10pt; border-radius:10px; margin: 0px 0 30px 35px; padding:0px;
}

My ie.css is overriding any CSS from the style.css file above it. Any CSS that works is NOT added to the ie.css. The style.css styles will take effect in all versions of IE. You only need to override the styles that do not look good.

That's it. Christin, I hope we can help you make the nav look good in all web browsers.

Comments

    0 of 8192 characters used
    Post Comment

    • hotwebideas profile imageAUTHOR

      Bruce Chamoff 

      5 years ago from New York

      You're welcome, Christin. Let me know how it goes ;)

    • ChristinS profile image

      Christin Sander 

      5 years ago from Midwest

      Thanks for this! Voted and shared and I will do a workaround for IE older versions... grumble grumble. Great info :)

    • hotwebideas profile imageAUTHOR

      Bruce Chamoff 

      5 years ago from New York

      You're welcome. I am proud to develop this habit.

    • flashmakeit profile image

      flashmakeit 

      5 years ago from usa

      Thank you for the very useful technical information about CSS.

    working

    This website uses cookies

    As a user in the EEA, your approval is needed on a few things. To provide a better website experience, hubpages.com uses cookies (and other similar technologies) and may collect, process, and share personal data. Please choose which areas of our service you consent to our doing so.

    For more information on managing or withdrawing consents and how we handle data, visit our Privacy Policy at: https://hubpages.com/privacy-policy#gdpr

    Show Details
    Necessary
    HubPages Device IDThis is used to identify particular browsers or devices when the access the service, and is used for security reasons.
    LoginThis is necessary to sign in to the HubPages Service.
    Google RecaptchaThis is used to prevent bots and spam. (Privacy Policy)
    AkismetThis is used to detect comment spam. (Privacy Policy)
    HubPages Google AnalyticsThis is used to provide data on traffic to our website, all personally identifyable data is anonymized. (Privacy Policy)
    HubPages Traffic PixelThis is used to collect data on traffic to articles and other pages on our site. Unless you are signed in to a HubPages account, all personally identifiable information is anonymized.
    Amazon Web ServicesThis is a cloud services platform that we used to host our service. (Privacy Policy)
    CloudflareThis is a cloud CDN service that we use to efficiently deliver files required for our service to operate such as javascript, cascading style sheets, images, and videos. (Privacy Policy)
    Google Hosted LibrariesJavascript software libraries such as jQuery are loaded at endpoints on the googleapis.com or gstatic.com domains, for performance and efficiency reasons. (Privacy Policy)
    Features
    Google Custom SearchThis is feature allows you to search the site. (Privacy Policy)
    Google MapsSome articles have Google Maps embedded in them. (Privacy Policy)
    Google ChartsThis is used to display charts and graphs on articles and the author center. (Privacy Policy)
    Google AdSense Host APIThis service allows you to sign up for or associate a Google AdSense account with HubPages, so that you can earn money from ads on your articles. No data is shared unless you engage with this feature. (Privacy Policy)
    Google YouTubeSome articles have YouTube videos embedded in them. (Privacy Policy)
    VimeoSome articles have Vimeo videos embedded in them. (Privacy Policy)
    PaypalThis is used for a registered author who enrolls in the HubPages Earnings program and requests to be paid via PayPal. No data is shared with Paypal unless you engage with this feature. (Privacy Policy)
    Facebook LoginYou can use this to streamline signing up for, or signing in to your Hubpages account. No data is shared with Facebook unless you engage with this feature. (Privacy Policy)
    MavenThis supports the Maven widget and search functionality. (Privacy Policy)
    Marketing
    Google AdSenseThis is an ad network. (Privacy Policy)
    Google DoubleClickGoogle provides ad serving technology and runs an ad network. (Privacy Policy)
    Index ExchangeThis is an ad network. (Privacy Policy)
    SovrnThis is an ad network. (Privacy Policy)
    Facebook AdsThis is an ad network. (Privacy Policy)
    Amazon Unified Ad MarketplaceThis is an ad network. (Privacy Policy)
    AppNexusThis is an ad network. (Privacy Policy)
    OpenxThis is an ad network. (Privacy Policy)
    Rubicon ProjectThis is an ad network. (Privacy Policy)
    TripleLiftThis is an ad network. (Privacy Policy)
    Say MediaWe partner with Say Media to deliver ad campaigns on our sites. (Privacy Policy)
    Remarketing PixelsWe may use remarketing pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to advertise the HubPages Service to people that have visited our sites.
    Conversion Tracking PixelsWe may use conversion tracking pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to identify when an advertisement has successfully resulted in the desired action, such as signing up for the HubPages Service or publishing an article on the HubPages Service.
    Statistics
    Author Google AnalyticsThis is used to provide traffic data and reports to the authors of articles on the HubPages Service. (Privacy Policy)
    ComscoreComScore is a media measurement and analytics company providing marketing data and analytics to enterprises, media and advertising agencies, and publishers. Non-consent will result in ComScore only processing obfuscated personal data. (Privacy Policy)
    Amazon Tracking PixelSome articles display amazon products as part of the Amazon Affiliate program, this pixel provides traffic statistics for those products (Privacy Policy)