Understanding CSS Vendor Prefixes

Have you ever wondered about what -moz- or -webkit- markings in CSS mean? Well, if you have, you are in the right place! Those markings are called vendor prefixes.
About Vendor Prefixes
Let’s answer the question: What are vendor prefixes? Simply put, vendor prefixes are a way for your browser to support new CSS features before they become fully supported in all browsers.

Link: https://dzone.com/articles/understanding-css-vendor-prefixes?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

How to Use CSS Reset

Reset in code presents a short set of rules that resets styling of all elements to a consistent baseline. It is needed because the styling isn’t consistent across browsers. You don’t want something like pre-styling of, e.g. table element, to mess with you when you’re on.

When I was starting with CSS it is said to me that on the beginning you should always write:

Link: https://dzone.com/articles/how-to-use-css-reset?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

How to Use CSS Overflow

The CSS overflow property specifies what to do in case content is too large to fit in the container box. It specifies if a scrollbar should appear, or if content gets clipped.
The overflow property is a shorthand for overflow-x and overflow-y. The overflow-x property specifies handling the overflow in the horizontal direction, while overflow-y specifies handling the overflow in the vertical direction.

Link: https://dzone.com/articles/css-overflow-1?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Top 10 Lightweight CSS Frameworks for Building Fast Websites in 2018

When building a website, using a CSS framework is a real time saver as it provides you with tools every web designer needs when crafting a site. But as you know, loading speed is a very important quality factor. Therefore, I have compiled an actualized list of the current top 10 lightweight CSS frameworks, for creating beautiful, functional, and super fast loading websites. Pure CSS Only 3.8KB minified and gzipped, but packed with features! Pure CSS has been my lightweight framework of choice for years now, including when working with an outsourcing software development team.

Link: https://dzone.com/articles/top-10-lightweight-css-frameworks-for-building-fas?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

How to Build a Website Compatible With IE

Internet Explorer within a span of 7 years of its debut captured a market share of 95%, but its share has since crumbled to 3.2%. At present, IE experiences loads of compatibility issues and to add to its troubles, even Microsoft has pulled back all its support from IE’s earlier versions and has shifted its focus to its new browser, Microsoft Edge.
But even in spite of the dropped market share and lack of support, IE still manages to hold considerable ground in the market and, trust me when I say this, even the experience of your tiny percentage of users coming from IE can make or break your brand, making it absolutely critical to test for compatibility issues. Although this is a time when cross-browser compatibility is a big thing, all the browsers still behave differently, even when it comes to how margins and paddings are treated, how fonts are rendered, or how default styles of elements are interpreted, etc. IE itself is loaded with such issues and here I’m going to talk about some of the most prominent ones.

Link: https://dzone.com/articles/how-to-build-a-cross-browser-compatible-website-wi?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Live Editing HTML and CSS With Chrome DevTools

Chrome DevTools is a powerful suite of web development tools built right into the Chrome browser. One of the most useful features of DevTools for web developers is the ability to live edit the HTML and CSS on a page. This functionality allows any developer, even those with weaker HTML and CSS knowledge, to quickly prototype and iterate on potential changes to a web page.
While working on Lucidchart, one of my recent projects was to add some check marks into the inputs where users fill in their billing information in order to convey immediate feedback when the users entered properly formatted and valid information. Even though I am more comfortable working in our backend code than I am with CSS and HTML, I was able to easily implement these check marks with the power of live editing.

Link: https://dzone.com/articles/live-editing-html-and-css-with-chrome-devtools?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Integrating Bootstrap with Vue.js using Bootstrap-Vue

In this article, we’ll explore how to integrate Bootstrap with Vue.js using Bootstrap-Vue.
React and Vue.js are two leading, modern JavaScript frameworks for front-end development. While React has a steep learning curve, a complex build process (if you’re coming from a jQuery world), all you need to do to start using Vue.js is a simple import script: