CSSPortal - Page 3 of 4 - Fun with CSS!

10 Image Shadows Using CSS

Today we have put together a small collection of 10 box shadows that you can use to give your images a bit more flair. The image shadows are created using the box-shadow property and with most examples we also use the :before and :after pseudo elements.

  • Rene Spronk
  • CSS Blog
  • April 19, 2014
  • 10 comments

Style Checkboxes and Radio Buttons

In this tutorial we are going to show you how to style checkboxes and radio buttons using only CSS code. By customizing these two elements, you’ll be able to keep your webpage colors and styles consistent with other elements on your page. The way we style the checkbox and radio button is by making the […]

  • Rene Spronk
  • CSS Blog
  • April 12, 2014
  • 11 comments

CSS Tips to Improve Page Loading Times

Page loading times is an important factor in ranking well in a variety of search engines, plus is also extremely important for the end user of a website. These days we all want everything straight away and we do not want to wait too long for webpages to load, if sites are too slow, there […]

  • Rene Spronk
  • CSS Blog
  • April 5, 2014
  • 4 comments

Adding Image Overlay with CSS

Over the past few weeks, I’ve received a number of emails asking me how to achieve the look that appears when hovering over an image on our css template page. The following tutorial will explain and show you how this can be done.

  • Rene Spronk
  • CSS Blog
  • March 30, 2014
  • no comments

Rotating Images with CSS

Have you ever found an image but wanted to display it flipped the other way? Previously you would have used your favourite image editor to create a new image that was flipped. These days it is now possible to rotate an image with CSS using the transform property.

  • Rene Spronk
  • CSS Blog
  • March 22, 2014
  • 3 comments

Remove Dotted Outlines

We’ve all seen the dotted lines around anchor links, and we know that they are there for a reason, but for the majority of us, we do not want them there. This snippet will show you how to remove them for your webpages. Please keep in mind that the dotted lines are there for accessibility, […]

  • Rene Spronk
  • CSS Snippets
  • March 9, 2014
  • no comments

Fonts with CSS @font-face Rule

The CSS @font-face rule allows web developers to use any font to display text on a webpage. By using the @font-face rule you’ll no longer be restricted to using the limited amount of fonts that are available on the users computer.

  • Rene Spronk
  • CSS Snippets
  • March 8, 2014
  • no comments

Style Placeholder Text

The placeholder attribute was introduced with HTML5 to offer the user the ability to show text in an input field, when the user clicks on the input field and starts typing the text disappears so that you can enter what you need. Here we will show you how you can style the text displayed by […]

  • Rene Spronk
  • CSS Snippets
  • March 1, 2014
  • 1 comment

CSS Accordion

One great thing about CSS is the ability to create great looking designs for your websites and with CSS3 you can write code that does not require javascript (as long as you have the latest web browsers!). In this tutorial we will show you how to design a CSS Accordion without the need of javascript, […]

  • Rene Spronk
  • CSS Blog
  • May 26, 2013
  • 8 comments

CSS Tooltips

Have you ever wanted to create toolips with just CSS code? Like many people the answer is yes. In this tutorial we will go through the process and show you exactly how this can be done without using any javascript or images, only pure CSS code. Firstly let’s explain what a tooltip is: A tooltip […]

  • Rene Spronk
  • CSS Blog
  • May 11, 2013
  • 1 comment