In this post, I’ll share some beginner web developer tools.
This tool by Alexis Deveria provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
This user-friendly tool helps with css3 properties. And it tells which browser is compatible with specific properties.
Easy to use tool which helps check stylesheet for errors.
Use to check links on any web page.
Will always comes in handy when building responsive or adaptive website. Thanks to @MalteWassermann
The best part is all of them are Free! Hope this small list will help you to be a better Web Developer someday :)
Mary Lou from Codrops shared a couple of subtle modern tab styles and effects. The collection contains some styles and effects for modern tabs; from a simple box to a SVG shape. Depending on your design, different tab layouts and looks can spice up your sections; think outside of the box (literally) and you’ll see how interesting the usually boring tabs can become. Inspired? Check out the demo page provided.
View More View Demo
Pulling your hair dealing with CSS layout issue?
Here are some tips to fix common issues with CSS layout
Try to view source (CTRL+U on FF) on your browser. This is the best tools to check if all tags are properly close or if you have duplicate IDs on one same page. Most of the times, this is the culprit.
Another great tool. Try delete your suspected element that caused layout issue using inspect element. This way, you can focus to fix only that element.
Clear your floating container using clearfix. When you have floating elements, don’t forget to add clearfix for the container. View full explanation about floats and clearfix by Chris Coyier.
/* A clearfix is performed as follows: */
content: " "; /* Older browser do not support empty content */
/* Or, if you don't require IE<8 support, the following is fine too: */
/* HTML with clearfix */
<div style="float: left;" class="clearfix">Sidebar</div>
<!-- No Clearing div! -->
Do you have other tips on fixing CSS layout issue? Comments are welcome!