title: Creating a circular menu with CSS
body: <p>I'm trying to create a circular menu in CSS for a school project.</p>
  
  <p>This is what the menu would look like:</p>
  
  <p><img src="https://i.stack.imgur.com/rIbCx.jpg" alt="enter image description here"></p>
  
  <p>I am not looking for the complete source just an idea how you experienced developers would do it.</p>
  
  <p>I was thinking to create 8 triangles and then the middle to place a circlular div with position absolute; <strong>but</strong> the triangles, since they're created with borders, when you hover them they are not absolutely selectable. It's kinda buggy.</p>
  
  <p>Is it even possible to create this with no images?</p>
  
  <p>EDIT:</p>
  
  <p>The menu will after by animated using jQuery; thus I will be using jQuery and jQuery UI but no other library and no images (i dont need the icons anyway).
  As for compatibility, should work on IE9+ / Chrome / Opera 11.52+ / Firefox 4+.</p>