CSS

Posted on

I recently started a new front end developer position, and we have these weekly challenges, which I think is pretty awesome, but I thought this would be a great chance to share some of the new techniques that I learn. This past week’s challenge was to create a background pattern using only CSS gradients, and being able to use it on various colored backgrounds. Let’s just get right to it…

The pattern we want to make is in  horizontal a zig zag with a vertical line on the edge. Now, this isn’t something you can’t just jump in to right away and start coding, it requires a little bit of thought/planning before executing the code. Read More

CSS

Posted on

As a front end developer, I believe you should be learning something new almost everyday to better yourself at your craft, or at least give yourself a better understanding of what it is you’re actually doing/coding. Sure, you may know  that a float will push some content/image to the left or the right, but are you truly understanding what the meaning of your code is and what it is doing or how it is affecting other elements on your page? I will openly admit, I haven’t always known exactly what it’s doing and why, but I know it works so I don’t bother trying to dig any deeper. I’m sure many are guilty of this. Read More

SASS Tutorial

Posted on

I’m always in search of better ways to improve my workflow and anything that can help my CSS be more consistent and easy to manage. My biggest kick lately, is coming up with mixins that help me cut down on writing repetitive CSS. One of my biggest issues were buttons and when I started to really think about it, there is just a laundry list of things that are a pain with writing buttons. Each button needs a hover and active state. Is each hover consistent with the rest of the hovers, whether it be the lightening/darkening of a color, box shadow, border, etc. There are so many possibilities for hover and active states when it comes to buttons.
Read More

Freebies

Posted on

I recently wrote a post on not over complicating responsive navigation. That got me thinking, I should take this a step further and make my own responsive navigation with drop downs, so that’s exactly what I did and spent some time developing my own navigation using SASS to share. This is really my first bit of code I’m putting out to the public, so I thought it would be a good experience to write a post about it and how to use it. Read More

Tutorial

Posted on

I’ve come across many who have struggled time and time again with responsive navigation. My response is, it doesn’t need to be a struggle! I’ve put together an example that shows you that it doesn’t need to be very complicated and doesn’t need to cause you any headaches. All you need is a few lines of jQuery, some basic CSS, and a basic knowledge of media queries. Personally, I’m a big advocate of using SASS, so I’ve written my demo using that. If you’re not a SASS user, I recommend you give it a try.

Read More