As the name implies, Chrome Developer Tools is a set of web developer tools built directly into the Google Chrome browser that allows web developers to interfere and manipulate applications via the browser. With this tool you can easily: View and change page’s styles Debug Javascript Code Analyze runtime performance, so you can optimize your code View messages and running JavaScript in the Console To open DevTools, you can right-click anywhere on the page and select inspect element or you can choose the “tools > developer tools” option from the top right menu.   Now I’m going to show you some really useful and simpleRead More →

Hello! In this entry you will discover about CodePen.io, a handy tool for any kind of web designer, including ourselves. The use of this webpage is completely free, and you can create as many pens (which will be explained later) as you wish. It does have a Premium feature that adds more functionalities, but for most of the users needs, it isn’t necessary at all. This webpage is made specifically for the use, practice and learning of the three main languages for web: HTML, CSS and JS. It lets you work on it online, getting updated results as you work on it, which removes theRead More →

There are many types of dropdown menus, but in this post we will explain how to create the most basic. 1. HTML Use any element to open the dropdown menu, <button>, <a> or <p> element. Use a container element (like <div>) to create the dropdown menu and add the dropdown links inside it. Wrap a <div> element around the button and the <div> to position the dropdown menu correctly with CSS. 2. CSS The following structure is one of the main possibilities that is related to the previous HTML.  Basic Dropdown:  Create a dropdown box that appears when the user moves the mouse over anRead More →