Grow your CSS skills. Land your dream job.

css irregular shapes and fill

  • # June 22, 2013 at 7:44 am

    hi, hope you can help as cant seem to find the right answer…
    i wd like to draw a shape eg. tl=10px5px, tr=90px10px, bl=4px99px, br=99px90px
    and fill it with red on a blue background, and put a zindex on it so i can put some text on it

    hope sombody can help, many thanks in advanve

    # June 22, 2013 at 7:49 am

    Do you have an image we could look at?

    # June 22, 2013 at 7:51 am

    no sorry, there is no image, just want to draw a four sided shape with difflengh sides and fill with blue, eg by co-ordinates above, thanks for your reply

    # June 22, 2013 at 7:53 am

    I think the canvas element is probably the best solution if flexibility is required.

    Otherwise just use an image or better yet a bg image and have done with it.

    # June 22, 2013 at 7:59 am

    yeah thats what i want to do, use the canvas element, i want to control the co-ordinates using javascript, but i dont know the script to draw ‘irregular’ shapes, ie i want to draw a box and fill it with colour, ta

    # June 22, 2013 at 9:40 am

    On second thoughts..SVG might be better.

    http://tutorials.jenkov.com/svg/index.html

    http://codepen.io/Paulie-D/pen/rhulq

    # June 22, 2013 at 12:48 pm

    hi, thanks for your effort, but its not quite what im looking for, thanks again, i have managed to figue out how to draw the shape i want but need to repost question in reference to using other elemnts on top

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".