20 essential CSS tricks every designer should know | Webdesigner Depot webdesignerdepot.com

This one’s for the absolute beginners. Once you’ve learned how the box model works, and how to float those boxes, it’s time to get serious about your CSS. To that end, we’ve compiled a massive list of tips, tricks, techniques, and the occasional dirty hack to help you build the design you want. CSS can get tricky, and you should too. And now, in no particular order, (almost) everything you’ll need to know: 1. Absolute positioning If you want control over where an element lives on our website at all times, absolute positioning is the key to making this happen. If you think of your browser as one big bounding box, absolute positioning allows you to control exactly where in that box an element will stay. Use top, right, bottom and left, accompanied by a pixel value to control where an element stays. position:absolute; top:20px; right:20px The CSS above sets the position of an element to stay 20px from the top and right edges of your browser. You can also use absolute positioning inside of