Skip navigation
monkeyk1234@aol.com
Currently Being Moderated

Creating rounded corner boxes in Dreamweaver cs5

Jan 30, 2012 11:28 AM

Tags: #html #dreamweaver_cs5

I can not get the property for creating rounded corner in Dreamweaver cs5. When I tried to add property "border-radius", "-moz-border-radius-topleft', or "-webkit-border-top-left-radius", it kept giving me the message- "Invalid property". I don't know why. I did last summer and it worked. Would someone please help me with this matter.

 
Replies
  • Currently Being Moderated
    Jan 30, 2012 11:48 AM   in reply to monkeyk1234@aol.com

    In CSS, border-radius:15px;  should work for all borders, assuming you're not looking at it in Internet Exploder before version 9.

     
    |
    Mark as:
  • Currently Being Moderated
    May 24, 2013 4:00 AM   in reply to monkeyk1234@aol.com

    go to this page it has a tool that generates the right code

     

    http://www.geckodesigns.com/tutorial-dreamweaver-css-radius-corners.ph p

     

    here is a example of the correct code to write...

     

    -webkit-border-radius: 10px;

    -moz-border-radius: 10px;

    border-radius: 10px;

     

     

    I am not sure if this is officially the right way to do it, but it worked for me

     
    |
    Mark as:
  • Currently Being Moderated
    May 24, 2013 4:29 AM   in reply to kdennis111213

    kdennis111213 wrote:

     

     

     

    I am not sure if this is officially the right way to do it, but it worked for me

     

    Yes, thats fine:

     

    -moz-border-radius: 8px 4px 7px 9px; /*top left / top right /bottom right / bottom left */

    -webkit-border-radius: 8px 4px 7px 9px;

    border-radius: 8px 4px 7px 9px;

     

    Not sure why anyone bothers with the css panel...get stuck into the code its much quicker.

     
    |
    Mark as:
  • Currently Being Moderated
    May 24, 2013 6:15 AM   in reply to osgood_

    "Technically" the browser specific prefixes are "invalid code" however they are necessary in the older versions of the individual browsers to make the border-radius work. That could be what you are seeing and it can be completely ignored without issue. All current  versions of the major browsers  see the standard "border-radius" attribute without prefixes now.

     
    |
    Mark as:
  • Currently Being Moderated
    May 24, 2013 8:00 AM   in reply to Jon Fritz II

    Jon Fritz II wrote:

     

    "Technically" the browser specific prefixes are "invalid code" however they are necessary in the older versions of the individual browsers to make the border-radius work. That could be what you are seeing and it can be completely ignored without issue. All current  versions of the major browsers  see the standard "border-radius" attribute without prefixes now.

     

    Yes, I agree, I just throw in the specific browser code to catch anyone using a backdated version of a particular browser. I'm always a bit unsure when to stop supporting a particular browser if it can be supported without issue.

     

    It would be good to see a list of those browers which still need the specific code for the radius to work to make a judgement.

     
    |
    Mark as:
  • Currently Being Moderated
    May 24, 2013 8:30 AM   in reply to osgood_

    I do realize that the prefexes are "invalid" code. But if you're checking a CSS3 style sheet through the W3C's (beta) checker, it passes.

     

    Here's my comment about "invalid" code.

     

    Today, I got a call from a client. He told me that a jQuery "slider" did not work for him—he had an older computer and didn't really care to upgrade it. There is another element on his home page that I have made invisible to Internet Exploiter 8 and before, as they don't render it correctly.

     

    There is some person out there who has the old browser and, if you're working for him your excellent design work may be invisible to him. I think that Mozilla actually forces you to update Firefox. I'm not sure if Google forces Chrome updates and I believe Apple doesn't update Safari unless you buy an operating system upgrade (which is Microsoft's policy, too). I know next to nothing about Opera other than the fact that it is more popular in Europe than in America.

     

    The vendor prefexes were all about supporting a "standard" that wasn't. There were different ways of stating the arguments for some browsers. I recall Firefox needed things in an order that was "backwards" to what Webkit wanted. And now that Google is forking Chrome away from Webkit, the vendor prefexes may be on their way out (or Google simply won't require them).

     

    But there are a lot of people out there who don't update their browsers.

     

    I told my client that, if he is using a really old version of Internet Exploder, he needs to stop using it and start uding a modern browser that will not provide a "back door" to some Chinese military corporate espionage unit who wants to get all of the plans off his dexktop computer. Since he works in an industry with a security clearance, I think he will tend to want to do that. These old browsers are unsafe.

     

    But we as designers need to serve our clients. And part of that may be understanding that they may require vendor prefexes until the CSS3 standard actually is a standard.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points