sass

Style the Web More Effectively with SASS

As the web grows and changes, new technologies arise to help the developers on their interesting journey in bringing life to ideas and designs. This is how CSS was initially born and how CSS preprocessing technologies such as SASS came into being. In this post we will explore some of what SASS has to offer. […]

css

CSS Box Shadow Use Cases and Examples

The box-shadow property allows developers to implement multiple drop shadows, either outer or inner placed on box elements. The different attributes they can change are size,color, offset and blur. There is an increase of support through different browsers that include Mozilla (Firefox) and Webkit (Safari & Chrome). Mozilla and Webkit no longer require their implementation […]

css

Making Attractive Functional Gradients in CSS

CSS gradients are a great tool in any modern developer’s arsenal. These gradients allow you to display smooth transitions between multiple rounds of specified colors. Similar to how you can declare a set background solid color element in CSS, you can also do this to declare a gradient background. Using gradients in CSS is a […]

css

CSS Rounded Corners 101

Float is a property in CSS that has to do with positioning. In order to understand its origin, it’d be smart to first look at a print layout and how it relates to that. In print layouts the images are set into a page so that text will wrap around them when needed, commonly referred […]

screen-shot-2016-10-11-at-9-31-11-am

Comparing Javascript & jQuery Through Building a Pomodoro Timer

Modern web development offers an incredible variety of tools, libraries, and frameworks to build web sites/applications. As of 2016, jQuery, React, Angular, and Vue are the most popular front-end libraries/frameworks in use. They can all be used to build and accomplish similar things, but in different ways. What are the advantages/disadvantages of each? How does […]

css

No More Janky CSS: Using OOCSS, SMACSS and BEM

Janky: Of extremely poor or unreliable quality. If you are writing just a few lines of CSS, it may not make a difference how you structure it. But as a project grows and the CSS becomes larger, the question of structuring CSS becomes more pertinent. There are a number of methodologies for writing better CSS. […]

css

CSS Background-image tricks and gotchas

Using a css background-image property is CSS allows for versatility in creating a background element. The css background image property can be applied to a graphic which includes, PNG, JPG, GIF, WEBP, and SVG, alongside the special case of using a gradient as the background.           There are then multiple files that can be used for […]

css

CSS Position Tricks and Gotchas

A position property is what allows you to manipulate the location of an element. It has multiple values and properties so that you can change the location based to your own liking. These assist when dealing with multiple elements or a parent and child element. One of the first code examples we’re going to show […]

css

How to Use CSS Native Variables

Variables in CSS (or custom properties or CSS native variables) are becoming more widely adopted across the major browsers. CSS variables allow for enhanced control over your code as well as the ability to reduce clutter and avoid repetition in your code. What’s more, with CSS native variables you can use JavaScript to update application and values based on […]

css

What is SVG and Why use it?

Scalable Vector Graphics or SVG is an image format which allows you to draw two-dimensional vector graphics to be used on websites. The graphics are defined in XML format. The scalable aspect lets you resize and zoom without compromising image quality. SVG images can be static or animated. SVG is a W3C standard so it […]