friendship&&dani ||

This is an archived version of FeralFront. While you can surf through all the content that was ever created on FeralFront, no new content can be created.
If you'd like some free FeralFront memorabilia to look back on fondly, see this thread from Dynamo (if this message is still here, we still have memorabilia): https://feralfront.com/thread/2669184-free-feralfront-memorabilia/.

    [FANCYPOST bgcolor=#5c112d bordercolor=; border: ; border-radius: 0px 60px 0px 60px; height: 200px; overflow: hidden;]
    [size=4pt]-[/size]


    [FANCYPOST bgcolor=#3b001b bordercolor=; border: ; border-radius: 0px 0px 0px 56px; height: 80px; width: 222px; overflow: auto; opacity: .8; margin-left: -14px; font-family: arial; letter-spacing: 1px; text-align: center; font-size: 10px;]
    Hey there :3
    [/fancypost]    		 [FANCYPOST bgcolor=#3b001b bordercolor=; border: ; border-radius: 0px 0px 0px 0px; height: 80px; width: 222px; overflow: auto; opacity: .8; font-family: arial; letter-spacing: 1px; text-align: center; font-size: 10px;]
    So how much do you already know? c:
    [/fancypost]


    [/fancypost]

    Awesome c:
    Let's see... can you do different border-widths? How about different border-radiuses? :)
    It's alright if not; I'm just interested to see what you know so I can teach you what you don't ^^

    No problem :)
    All you need to do is add a number for each corner, or each side...


    For example:


    Code
    1. ; border-width: 2px 0px 4px 3px


    The same goes for border-radius...


    Try them out and see if you can tell me what number the corners/sides go in (which corner does the first number edit, which does the last edit?, etc.)


    The order of the four numbers always stays in the same order... make sense, or need more clarification? C:

    Try to do it without the code; if you don't need the code, and can write it from scratch, you'll be that much better at it :3


    The way to do it is the same with the border-width...


    Remember how we had the four different specifications instead of the usual one? Do the same here!


    So just translate


    ; border-width: 4px 2px 0px 1px


    to border-radius... C:

    Nice C:


    Alright, then I suppose it's time we start on scrollies :D


    So you know that to have a scroll bar you actually need three specifications, right?


    -Width
    -Height
    -Overflow


    These all work the same way as other specifications... For example:


    ; width: 200px
    ; height: 100px
    ; overflow:


    So when you specify the height and width, they changes the size of your fancypost.
    However, when you set new restrictions, you need to make sure the text stays inside the fancypost and doesn't overflow.
    If you don't add in overflow, it will just keep showing your text on and on outside of your fancypost.


    There are two ways you can conceal the overflow:
    -auto
    -hidden


    The more common way is by saying overflow: auto.
    By doing this, you're adding a scroll bar so that the text stays within its allotted area (the area you specified when you added height and width to your code).


    The alternative way is overflow: hidden.
    This doesn't give you a scrollie. Instead, the text that would go beyond your fancypost simply isn't visible.


    I know it's a lot to take in!
    Did you understand this, or want me to break it down? :3

    [FANCYPOST bgcolor=black bordercolor=white; border: 5px dotted black; border-radius: 100px; background: url(http://fc08.deviantart.net/fs7…_Bokeh_by_contractcat.jpg); height:50; width:50; border-radius: 2px 10px 4px 3px; width: 200px; height: 100px; overflow:]

    I think I did it right......

    [/fancypost]

    Code
    1. [FANCYPOST bgcolor=black bordercolor=white; border: 5px dotted black; border-radius: 100px; background: url(http://fc08.deviantart.net/fs70/i/2010/153/5/a/Purple_Bokeh_by_contractcat.jpg); height:50; width:50; border-radius: 2px 10px 4px 3px; width: 200px; height: 100px; overflow:][align=center][font=georgia][color=black]I think I did it right......[/color][/font][/align][/fancypost]

    [/align]