border-radius in IE9

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • HaLo2FrEeEk
    Contributor
    • Feb 2007
    • 404

    border-radius in IE9

    Evey other site I've been to that uses border-radius seems to work just fine, but for some reason I cannot get it to work! I don't know what I'm doing wrong, but I tested this very simple example:

    My bad, I forgot the link was password protected, here's the stylesheet:

    Code:
    .rounded {
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border-radius: 10px;
      background-color: black;
      color: white;
      width: 200px;
      height: 200px;
      }
    In IE9, Firefox, Opera, Safari, and Chrome. It works in all but IE9.

    Am I missing something? From what I read, the http-equiv meta tag is not necessary, and most of the sites I've seen using border-radius do not use this tag, so I don't think that's it.

    I don't want to use images. IE9 is finally capable of being standards compliant, I want to utilize that. I don't know what's happening though, I just get a black square. If I open up developer tools and switch to IE9 Standards document mode, then it works, but not in Quirks mode.
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    IE9, being the inept browser it is, requires all four corners to be specified to work. Modern browsers don't need that.

    Comment

    • HaLo2FrEeEk
      Contributor
      • Feb 2007
      • 404

      #3
      IE9 is much better when it comes to standards compliance. The problem was actually that I didn't have the HTTML5 doctype, I set that and it worked with just the one value specified. I don't know if it's been changed, but the version of FF I have requires the -moz- prefix, safari, chrome, opera, and IE9 don't require a prefix.

      Comment

      • drhowarddrfine
        Recognized Expert Expert
        • Sep 2006
        • 7434

        #4
        IE9 is much better when it comes to standards compliance.
        Better than what? IE8? Saying one piece of crap is better than another doesn't make it smell any better. IE9 is still the worst new browser on the planet, by far, and is not a modern browser by any means.

        Border-radius has been in all the other browsers going back at least since FF3.0. It's new in IE9.

        The vendor extension is dropped in FF4. I don't recall if that's already been dropped in all the other browsers.

        Comment

        • HaLo2FrEeEk
          Contributor
          • Feb 2007
          • 404

          #5
          Ok, I'm not gonna get into a monkey shit fight with you about browsers. I prefer IE because it's what I've used for years. It stands up really well to the competition now that's it's CSS3 and HTML5 standards compliant. Sure, it took a while to get there, but it got there all the same, so let's drop it.

          Comment

          • drhowarddrfine
            Recognized Expert Expert
            • Sep 2006
            • 7434

            #6
            It is not HTML5 or CSS3 compliant. No browser is because neither spec is finished. However, if you'd like to learn how far behind IE9 is behind ALL other browsers, see these links:

            When Can I Use? (Scroll to the bottom for a summary)
            IE9 is not a modern browser

            There is no fight about browsers. Known. Provable. Verifiable. IE9 is the worst on the planet. And no amount of Microsoft PR is going to change that.

            Why people insist on excusing Microsoft's shortcomings on this, I'll never know. Quit being a mushroom. No modern developer today uses IE.

            Comment

            • Atli
              Recognized Expert Expert
              • Nov 2006
              • 5062

              #7
              The problem was actually that I didn't have the HTTML5 doctype, I set that and it worked with just the one value specified.
              Why should the HTML doctype affect the parsing of the stylesheet? CSS3 is in no way reliant on HTML5 to work properly. It should work just as well on HTML4 or XHTML pages.

              I don't doubt your right. I'm just questioning the logic of it.

              That's kind of the issue with IE. Small crap like that that drives us all insane in the end.

              Comment

              • drhowarddrfine
                Recognized Expert Expert
                • Sep 2006
                • 7434

                #8
                I missed that. You're right, it shouldn't have affected it.

                Comment

                • HaLo2FrEeEk
                  Contributor
                  • Feb 2007
                  • 404

                  #9
                  Well regardless, a page isn't HTML5 compliant without a doctype, according to the W3C, so it was necessary anyway.

                  And I really don't see why you hate it so much. I'm not saying it's the best thing since sliced bread, but I like it. I also like Chrome, and I don't really like Firefox, Safari, or Opera, all of which I've used. I develop for all browsers, IE included. I want users from all browser preferences to get a similar experience on my pages, and you can't deny that IE9 is definitely a step in the right direction. I just don't understand why you're so against it.

                  Oh and I use IE to develop, have for years, and my sites look the same in all browsers.

                  Lets just drop it, you're just gonna get angry, I'm not gonna change my mind, and it's moot anyway because I solved the issue.

                  Comment

                  • drhowarddrfine
                    Recognized Expert Expert
                    • Sep 2006
                    • 7434

                    #10
                    I totally agree with you that browser preference is a personal decision and which one a person chooses is just that. However, IE has always been a thorn in a developer's side because it prevents developers from creating pages and using the web to its full potential. For example, the following items are usable in every browser except IE9 and some have been there for years:

                    # Application Cache (offline)
                    # Web Workers (threads in JavaScript)
                    # HTML5 Forms (validation mechanism, CSS3 selectors)
                    # JavaScript Strict Mode
                    # ForeignObject (embed external content in SVG)
                    # SMIL Animations (SVG animations)
                    # File API
                    # WebGL (3D)
                    # CSS3 Transitions (for animations)
                    # CSS3 Text Shadow
                    # CSS3 Gradients
                    # CSS3 Border Image
                    # CSS3 Flex box model
                    # ClassList APIs
                    # FormData
                    # HTML5 History API
                    # Drag'n Drop from Desktop

                    But you can't use them cause if you have users that use IE, you either have to avoid them or create additional code workarounds.

                    Border-radius, in your example, has been in all browsers for 2-3 years but you couldn't use it because it didn't work in IE. So you used images instead.

                    I was just starting on a long story here but now I'm called for dinner. IE holds back the web. DON'T use it!

                    Comment

                    • drhowarddrfine
                      Recognized Expert Expert
                      • Sep 2006
                      • 7434

                      #11
                      And I really don't see why you hate it so much.
                      Did you not read any of the links I posted earlier? You're not the first and it's the most frequent response I get everywhere. People say they don't understand why I hate IE, I give them the evidence, then they come back with the same question. The answer is right in front of their face, yet, they still think there's nothing wrong with IE and then they question me.

                      Here's my question. Since it's obvious IE9 is technically inept and 3 years behind all other browsers, why do you insist on defending it and, more, why do you use such a backwards browser when the others are obvious far superior and advanced?

                      But if anything I've said is wrong, please feel free to show contradictory evidence. I've never seen any and no one's been able to do so...ever.

                      Comment

                      • colinod
                        Contributor
                        • Nov 2007
                        • 347

                        #12
                        Hwether there is something wrong with IE or not i was under the mpression that proffessional developer should design sites that work accross all platforms, which i beleiv is all HaLo2FrEeEk is trying to do!!!

                        Comment

                        • drhowarddrfine
                          Recognized Expert Expert
                          • Sep 2006
                          • 7434

                          #13
                          The original question was why border-radius didn't work in IE9. It had nothing to do with getting a site to work cross platform.

                          When a browser fails to comply with standards, as badly as IE9 does, you can't force it to do something it can't do. So you have to live with what it can do. In most cases, IE users just miss out as long as the functionality is there. IE users, before IE9, never missed rounded corners cause people don't use two browsers at the same time. Things don't always have to be pixel perfect. However, if you are talking about getting some function to work in an online ordering system, then you have to find a way to make it work.

                          Comment

                          Working...