CodeGuru Home VC++ / MFC / C++ .NET / C# Visual Basic VB Forums Developer.com
Results 1 to 5 of 5
  1. #1
    Join Date
    Nov 2012
    Posts
    4

    [RESOLVED] Issues with "border-radius"

    Hello there everyone, just a quick introduction before I get onto my problem.

    My name is Lucas, I am a school student undertaking a distance education IT course and currently we are studying PHP and HTML. I have decided to take learning CSS into my own hands so that I may make websites which aren't the horrible generic Black Text on Simple coloured background with Times new Roman font.

    To the issue at hand; the "border-radius" element is not functioning as intended. Disregard the clash between the text effect and the black background.

    CSS Issue.png

    So basically what is happening here is it is placing the "border" on each separate line, whereas what I intended for the element to do was surround a couple of paragraphs.

    Any idea how I may be able to do this? The style code used for this is:

    Code:
    -moz-border-radius-topleft: 50px;
    -webkit-border-top-left-radius: 50px;
    border-top-left-radius: 50px;
    -moz-border-radius-topright: 50px;
    -webkit-border-top-right-radius: 50px;
    border-top-right-radius: 50px;
    -moz-border-radius-bottomright: 8px;
    -webkit-border-bottom-right-radius: 8px;
    border-bottom-right-radius: 8px;
    -moz-border-radius-bottomleft: 35px;
    -webkit-border-bottom-left-radius: 35px;
    border-bottom-left-radius: 35px;
    However the exact same problem happens with:
    Code:
    border-radius: 50px;
    Perhaps I am using the wrong element? I am still a noob at coding, so all help and tips are appreciated even if they only hold little relevance to the issue at hand.

    Thank you!

  2. #2
    Join Date
    May 2002
    Posts
    10,943

    Re: Issues with "border-radius"

    First off, why don't you just use shorthand? It will save you so many bytes! And, you don't need -moz, -o, or -webkit since all modern browsers support border-radius.

    Code:
    border-radius: 50px 50px 8px 35px;
    Second, I bet you've styled a <span> tag instead of wrapping the whole thing in a <div>.
    Last edited by PeejAvery; November 13th, 2012 at 12:09 AM.
    If the post was helpful...Rate it! Remember to use [code] or [php] tags.

  3. #3
    Join Date
    Nov 2012
    Posts
    4

    Thumbs up Re: Issues with "border-radius"

    Haha, thank you for answering my most basic of questions!
    And I believe you are correct there, I'll use div tags.

    I've learned quite a bit from your single post

    I'd like to leave the thread open for a little bit longer should I have a related question if that's okay?

  4. #4
    Join Date
    May 2002
    Posts
    10,943

    Re: Issues with "border-radius"

    Typically we like to keep each thread it's own question. It really helps with organization!
    If the post was helpful...Rate it! Remember to use [code] or [php] tags.

  5. #5
    Join Date
    Nov 2012
    Posts
    4

    Re: Issues with "border-radius"

    Ah, fair enough. I shall mark this resolved then and proceed henceforth to post each question unto its own topic.


Posting Permissions

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





Click Here to Expand Forum to Full Width

Featured