Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Rounded Corners

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #246142
    TV
    Participant

    I’m very new to CSS…I’m trying to accomplish rounded corners. I use FireFox to test. I tried two ways to save the file—.html or .css obviously nothing is working. Would appreciate help!

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    #rcorners1 {
    border-radius: 25px;
    border: 2px solid #73ad21;
    padding: 20px;
    width: 200px;
    height: 150px;
    }
    </style>
    </head>
    <body>

    Rounded corners!

    </body>
    </html>

    #246143
    Paulie_D
    Member

    You’ve created an ID…but what have you applied it to?

    https://jsfiddle.net/c1crtnf6/

    #246152
    WayneKenney
    Participant

    What are you styling? Is the ‘rcorners1’ a div?
    Apply those styles to a div.

    Here’s your code, but with the rcorners style applied to a div and a span: Check This Code

    That will render your desired result.

    Note: Also, consider using class instead of id when dealing with styles.

    #246174
    Naresh
    Participant

    You don’t need to save this file as .css (it won’t work then). Just save it as .html. Second thing is, you need to assign the id (#rcorners1) to a div like this:

    <body>
      <div id="rcorners1">
        Rounded corners!
      </div>
    </body>
    

    Keep practicing! ;)

    #246194
    Beverleyh
    Participant

    It’s great that folks are still replying but has everyone missed the demo that Paulie posted? That gave the answer/solution.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.