/    Sign up×
Community /Pin to ProfileBookmark

Weird blocky text in IE8? Can you see it?

Copy linkTweet thisAlerts:
Jul 24.2012

Hey, I am getting some weird graphical errors in IE8, but I can’t tell if it is something to do with the fonts on my machine or the CSS/HTML coding itself (perhaps some connection between my @font-face code and the bolded text).

I was hoping you could have a look at the link below in IE8 and let me know if all the bolded text looks all blocky and pixelated. If you could post back a screen capture that would be even better! Thanks.

[URL=”http://citygolfcourses.ca/1140/”]This link[/URL]

The bolded text is the first word in each of the Core Values plus the header/titles.

to post a comment
HTML

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@jedaisoulJul 26.2012 — IE8 (and below) does not understand CSS3. So there is no point trying to use CSS3 features with IE8. It will not work. There are solutions on the web that claim to make IE8 (and a number of older non-compliant versions of popular browsers) CSS3 compliant, but:

  • 1. The code is humungous.

  • 2. It is mostly unnecessary now, as IE7 and IE8 are the only non-compliant browsers in common usage any more.

  • 3. I've not tested them.
    • Copy linkTweet thisAlerts:
    @hmsgoddessJul 26.2012 — You could also make a separate CSS file for ie only. This allows you to design things just for ie for the looks but allow you to keep the look you want/intented in browsers that play nice.
    Copy linkTweet thisAlerts:
    @BluegillMediaauthorJul 26.2012 — Ok, sorry I don't think I was clear enough (and hopefully this doesn't come across as snarky, just trying to get to the point).

    Yes I know that CSS3 is ignored by IE8 etc. etc. Yes I have a separate style sheet just for IE8 and below (in fact the stylesheet with the @fontface has been hidden from IE8 and below). If you have a look at the site you can see that within Firefox, the CSS3 font is show, but in IE8 it is just Arial that is showing (which is what I was going for). But that doesn't explain the weird blocky look to the bold text.

    My style sheets are put in like this:

    <i>
    </i>&lt;!-- @fontface code --&gt;
    &lt;!--[if !lt IE 9]&gt;&lt;![IGNORE[--&gt; &lt;link rel="stylesheet" href="css/fonts.css?v=1.0"&gt; &lt;!--&lt;![endif]--&gt;

    &lt;!-- IE8 font code (just set to arial and bold) --&gt;
    &lt;!--[if lt IE 9]&gt;&lt;link rel="stylesheet" href="css/ie8-.css" type="text/css" media="screen" /&gt;&lt;![endif]--&gt;

    Can you see the blocky text in IE8? Any idea what would cause such a thing?
    Copy linkTweet thisAlerts:
    @BluegillMediaauthorJul 26.2012 — Well it took a bit, but I figured this out. I had some old code in there that made the scrollbar track transparent. The chroma colour must have been too close to some of my font colours and was taking out the anti-aliasing. The code I had was

    filter: chroma(color=#001); scrollbar-track-color: #001;

    so as it turned out it had nothing to do with my font definitions in CSS or CSS3 - lol. Just thought I would write this back in case someone else ends up with this issue (although I think it would be a rarity that someone else still has invisible scrollbar track code in there).

    Thanks for your help though.
    ×

    Success!

    Help @BluegillMedia spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 6.10,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,
    )...