SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    815
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    rounded-corners/IE -- .htc -- can someone look in IE please.... thx....

    hi,

    am using technique described here, http://jonraasch.com/blog/css-rounde...n-all-browsers
    for IE support for rounded corners....

    can someone here pls look at this pg
    http://mayacove.com/dev/css/test_div.html
    in IE (9, 8, & 7 if possible) to see if rounded corners are showing in IE?

    thank you very much..

  2. #2
    SitePoint Wizard bronze trophy cydewaze's Avatar
    Join Date
    Jan 2006
    Location
    Merry Land, USA
    Posts
    1,096
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Round corners in IE8 but the background of the box is black, so you can't see the text. Also, the text overflows the bottom of the box.
    <cfset myblog = "http://cydewaze.org/">

  3. #3
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    815
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    the background of the box is black?

    that's weird, I don't see that..

    ok, made everything white now...


    thank you very much....

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,114
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    It works fine in IE8 and 7, but it messes up IE9 (creating a thin black border), which supports border-radius anyhow. So it would be better to serve up the htc file just to IE8 and under, via a conditional comment.

    Code:
    <!--[if IE 8]>
      <style>
        div {behavior: url(border-radius.htc);}
      </style>
    <![endif]-->
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  5. #5
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    815
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    awesome.... thank you for your help.... ok, so just did what you suggested.. can you look again please..

    http://mayacove.com/dev/css/test_div.html

    thank you very much....

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,114
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Yep, works great in IE9 and IE8 now, but fails in IE7 because I made a mistake above. The code should read:

    Code:
    <!--[if lte IE 8]>
      <style>
        div {behavior: url(border-radius.htc);}
      </style>
    <![endif]-->
    The "lte" means "less than or equal to". The code I gave was just targeting IE8. Sorry about that. Asleep at the wheel.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  7. #7
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    815
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    ok, changed to

    Code:
    <!--[if lte IE 8]>
    so can you look more mo' time please...

    thank you very much...

    this IE testing thing is a pain.. I think when I have a bit more money I will buy a cheap, used windows laptop (but I also need an iPad to test on that for when doing mobile, oh brother... this is getting out of hand....;-)

  8. #8
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,114
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Yep, looks fine in IE7 now too.

    For what it's worth, I'm doing all this testing on my Mac. You can either load Windows on your Mac with Bootcamp (which comes with the Mac) or use a "virtual machine" program like VMWare Fusion (which I use) or Parallels. It's really nice to be able to use Windows and Mac all at once. I have IE open just like any other program.

    A free alternative to Fusion and Parallels is VirtualBox. Either way, you still need to acquire a copy of Windows.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  9. #9
    SitePoint Wizard bronze trophy cydewaze's Avatar
    Join Date
    Jan 2006
    Location
    Merry Land, USA
    Posts
    1,096
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Looks nice on my Win7 machine with IE8.
    <cfset myblog = "http://cydewaze.org/">

  10. #10
    Barefoot on the Moon! silver trophy Force Flow's Avatar
    Join Date
    Jul 2003
    Location
    Northeastern USA
    Posts
    4,606
    Mentioned
    56 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by ralph.m View Post
    A free alternative to Fusion and Parallels is VirtualBox. Either way, you still need to acquire a copy of Windows.
    Microsoft provides free VHD's: http://adamthetech.com/2012/02/micro...achine-images/
    Visit The Blog | Follow On Twitter
    301tool 1.1.5 - URL redirector & shortener (PHP/MySQL)
    Can be hosted on and utilize your own domain

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,114
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Force Flow View Post
    Thanks Adam. Nice link. (Although VHD sounds too much like a disease to me. )
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  12. #12
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    I don't mean to pull a line from deathshadows book of pain but I don't see the point in using HTC files for generating rounded corners, I mentioned in another thread the importance of content over design and why IE shouldn't be wasting your time with getting CSS3 properties to work. I have personally done load time tests when the CSS3 Pie HTC file is loaded compared to when its not and the amount of system memory and CPU usage you save is quite significant as the JavaScript in the HTC file itself creates a lot of elements within the DOM to achieve the rounded corner you desire in which you could easily achieve with images anyway without the overhead and frustrations.

    I know it sounds like a rant but now that we are heading towards 2013 with HTML5 and CSS3 growing strong I think we all need to embrace what we currently have but allow our websites to work sufficiently in IE7-9 but don't give them any special treatment apart from IE6 which may need a separate stylesheet but its becoming a known fact that IE6 is a lost cause now and can be forgotten about, to be blunt let the browser do the grunt work and worry more about the content itself rather than the layout around it as the main priority is that the website supplies the content to the user rather than them waiting on a HTC file to load just for some pretty cool looking rounded corners.

    Just my 2 cents.

  13. #13
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,114
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    I agree, Chris. I just let older browsers live without the corners now.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •