Skip to content

Tutorials

  • CSS
  • Excel
  • HTML
  • Javascript
  • Node.js
  • Others
  • SCSS
  • Web Development

Pages

  • Home
  • All Tutorials
  • About
  • Privacy Policy

Red Stapler

Coding Tutorials and Development Tips

  • Home
  • Tutorials
  • About

Category: CSS

best scroll animation library
CSS Javascript Web Development

The Best Scroll Animation Library

August 6, 2019 Red Stapler 0

In this tutorial, we’re going to show you how to easily create an animation on any HTML element that will trigger on scroll in just a few minutes using AOS library. Let’s check it out!….

Read more
google-style-login-form
CSS HTML Web Development

How to create Google Style Login Form

July 30, 2019 Red Stapler 0

In this tutorial, I’m going to show you how to create a responsive Google style login form using materialize framework in just a few minutes. Ready? Let’s check it out! The Material Design Material Design….

Read more
css-change-scroll-speed
CSS Web Development

How to Change Scroll Speed with CSS

July 24, 2019 Red Stapler 1

Changing scroll speed on website can be tricky. As the speed is controlled by the web browser setting and not the website. The most popular workaround is to use JavaScript to detect mouse event then….

Read more
10-web-design-ideas-2019
CSS Javascript Web Development

10 Stunning Web Design Ideas You Must See in 2019

July 22, 2019 Red Stapler 0

In this article, we’ll show you the collection of 10 stunning web design ideas and inspirations I found on Codepen in 2019. Also, I’ll try to provide a brief detail of the technique and library….

Read more
how-to-draw-forky
CSS

CSS Drawing Tutorial for Beginners

July 15, 2019 Red Stapler 0

Hello and welcome to Red Stapler channel. In this tutorial, we’re going to show you the basic of how to use CSS to draw Forky from Toy Story 4 image step by step from scratch…..

Read more
evolution-of-web-design
CSS Javascript Web Development

Evolution of Web Design and Development 1990-2019

July 14, 2019 Red Stapler 2

The world first website was published in 1990. Comparing to today’s website, It’s really impressive to see how far we have come. In this post, we will travel back in time to see each step….

Read more
pure-css-horizontal-scrolling-website
CSS Web Development

How to Create CSS Horizontal Scrolling Website

July 11, 2019 Red Stapler 3

Horizontal scrolling has been around for quite a while and can be often seen on personal portfolio and resume website. So In this tutorial we’ll show you how to create it with pure CSS using….

Read more
adding-css-to-iframe
CSS Javascript Web Development

How to Apply CSS to iFrame

July 9, 2019 Red Stapler 1

iFrame is a very convenient way to display an external content on your webpage. However, it’s little bit complicate if you want to add additional or alter the existing CSS style. You cannot simply add….

Read more
css hidden scrollbar tutorial
CSS Web Development

Hidden Scrollbar on Scrollable Element with CSS

July 8, 2019 Red Stapler 1

In this post, we’ll show you how to hide a scrollbar while still enable scrolling on any element with CSS. First, If you want to hide a scrollbar and show it when user scroll, just….

Read more
vertically-center-div-css
CSS Web Development

How to Center Div Vertically with CSS

July 7, 2019 Red Stapler 0

Vertically centering div can be accomplished by many approaches but the most practical and efficient is using Flex/Grid layout or 2D Transform. Additional consideration is needed if there are more than one div under the….

Read more
css-3d-cube
CSS

Creating 3D Cube with Pure CSS

July 7, 2019 Red Stapler 0

3D cube effect can be achieved easily with CSS 3D Transform by creating div for each side of the cube. Then use rotateX, rotateY and rotateZ to put them into their places. Transform-origin is also….

Read more
css-glass-blur-effect
CSS

How to Create Glass Blur Effect with CSS

July 7, 2019 Red Stapler 0

CSS Glass blur effect is very popular on web page that want the div to be transparent and see through background or create a glass cover on another element. The snippet below uses masking trick,….

Read more

Posts navigation

«Previous Posts 1 2 3 4 … 6 Next Posts»
©2019 Red Stapler. All rights reserved.
  • Facebook
  • Twitter
  • Youtube