When developing with Sass sometimes there is a need to adjust the output style of the CSS. Sass’s default CSS style is good but might not be applicable for all situations. This post explores what those options are and how to adjust your compiler settings.
Mixins are one of the most powerful features of Sass. Mixins allow for efficient and clean code repetitions as well as an easy way to adjust your code with ease. If you are using Sass in your development workflow, no doubt you are using some of the mixins that I have covered below but some might also be new and helpful.
During a discussion a few weeks ago with an amazing front-end developer I was blown away that they hadn’t even given CSS preprocessing a go. I was bamboozled.
Learning something new, be it Sass, Less, YUI, Grunt, etc can always be a little daunting but making the time to ‘try’ is an important part of developing for the web.
If you get overwhelmed with all these new fandangle ‘things’ people are talking about, be mindful that you don’t necessarily have to adopt them. Having a basic understanding and awareness of what they do is all you really need to know. If the ‘thing’ really fits into your development workflow, then it’s a win. Dedicating more time to really learn and adopt it should be a no brainer. If it doesn’t, then at least you have the peace of mind that you’re not doing things in a inefficient manner.
The aim of this post is to introduce people quickly into the wonderful world of JavaScript functions. Functions are one of the core aspects in JavaScript.
A function is a set of statements that performs a task or calculates a value. Once you start to get your head around very basic JavaScript you will certainly need to invest some time into learning the in’s and out’s of functions. Basically, anytime you find yourself repeating code, but modifying the small parts, you could probably use a function.
Having a little knowledge of how the box-sizing property works and when you can utilise it is a neat trick to have up your sleeve. The reason for using the box-sizing property in your CSS is to alter the default CSS box model. Modifying the box model gives you the option of whether or not an element’s width and height include padding and border or not.
HTML lists are very common in everyday web development. You might be familiar with unordered lists (<ul>) and ordered lists (<ol>), which are the most commonly used, but you might not be aware that there are a few other options to consider. Like the definition list (<dl>) and the menu (<menu>) element, which was deprecated in HTML4, but has been reintroduced in HTML5.
A few weeks ago, I read a neat little post over at WPCandy about tweaking the WordPress login page. That post gave me a lot of inspiration and ever since redesigning WDW, it was on my to-do list. Today, I finally got around to styling it up.
One thing I discovered is that there is no need to add any plugins or to modify any core WordPress files. Adding a plugin for a simple task seemed a bit of an overkill and modifying the core files is never a good idea, especially when you update your instance of WordPress you have to re-do all your login styles again.
So if you want to go plugin free and give your login screen a little character you might enjoy this post.
Styling websites can get a little mundane if the site you are working on is not so aesthetically pleasing or challenging. If I find myself just going through the motions, I tend to step back and try to improve my skills. Doing this not only increases motivation for the project, it also puts are few more tricks up my sleeve for future projects.
Below are 10 CSS selectors. Some of them you probably use on every project and some possibly never. Next time you’re finding yourself going through the motions, maybe it’s a good time to sneak in some new selectors that you wouldn’t normally use.
Web Design Weekly is a newsletter with awesome links to the best news, articles and tutorials that hit the interweb during the week.
© 2011 - 2023 Web Design Weekly
