Making a Menu – Part I – The Menu

This starts my three part series of creating the following menu: My first post will be creating the basic menu, the next post will be adding in gradients, and the third and final post I will add border-radius and box-shadows, as well as some polish, to finish it up. Here we go! I am going […]

Coming soon…

I am going to take a dive into border-radius, gradients, and menus. See you soon! – Monica I am going to attempt a layman’s description of block formatting context.  Woo! – Lynn

Stars & Stripes

In a practical attempt to use stars, I wanted to put together this American flag. I used CSS stars (created here), positioning, and the z-index. Good ol’ American flag: Check out the code here: live demo

Triangles – part 2: Stars

Now that we know how triangles work, lets see something fun: stars! I started with three triangles to create a five-pointed star. HTML: <div class=”star”> <div class=”star-body”></div> <div class=”star-left”></div> <div class=”star-right”></div> </div> I adjusted the length of the sides of the triangle by changing the border-width property. The top border being longer and the right/left […]

Triangles

Today we are going to take a quick look at CSS triangles. They can be used for various visual elements. Menu indicators, speech bubbles, and so much more. Plus, they are so cute and really fun to play with!   This is the goal object, a little purple CSS triangle: First I started by setting […]