Forums

  • # July 17, 2013 at 9:20 pm

    What I’m attempting to do is have two shapes apart of a single element (the triangle that creates the speech bubble is one of the shapes and the circle is another).

    I’m trying to recreate this: [http://i.imgur.com/46DlQBd.png](http://i.imgur.com/46DlQBd.png “http://i.imgur.com/46DlQBd.png”)

    I’ve got the speech bubble finished, but I don’t know how to position the blue dot exactly 50% of the height of the speech bubble (**the speech bubble can vary in height**) and 10px to the left of it. It must be positioned absolutely so that the blue dot can be placed anywhere on the page.

    Here’s the CodePen I’ve created for it so far: [http://codepen.io/anon/pen/CevIh](http://codepen.io/anon/pen/CevIh “http://codepen.io/anon/pen/CevIh”)

    Please help.

    # July 17, 2013 at 9:51 pm

    How would I keep the border around the speech bubble/arrow since you’re using a solid black color without any border?

    # July 18, 2013 at 12:18 am

    You sir are a genius. Thank you!

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

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag