Categotry Archives: CSS

CSS3: Rounding off Corners of Images Tips

This is more of a tip than an actual tutorial but we will be showing you how to round off the corners of an image using just CSS3. This tip will work for all browsers except for a few older IE versions.

Dreamweaver CS5.5: Creating a WordPress 3.1 Theme in Dreamweaver CS5 Part 2

This tutorial carries on from Dreamweaver CS5.5: Creating a WordPress 3.1 Theme in Dreamweaver CS5 In the second part of this tutorial we will look at how to change the content, sidebar and footer sections of your WordPress template using Dreamweaver CS5.5.

Dreamweaver CS5.5: How to edit Joomla Templates with Dreamweaver.

In this tutorial we will show you how to set up Joomla(1.5 or 1.6) in Dreamweaver CS5 so that you may edit the CSS of your layout while still making good use of Dreamweavers great productivity tools. One warning before we proceed though, Whilst working with Joomla in Dreamweaver do not edit any of the core Joomla files. This goes… (more…)

CSS3: Simple Slideout Accordion Menu

In this tutorial we will show you how to create a simple accordion menu with submenu’s that expand out smoothly as someone mouses over the top of them. The simple animation we will be using is CSS3 with no javascript however it is supported by all the major browsers except for IE. With IE the menu will still work with… (more…)

Photoshop CS5: Blending Images into a Website Background

In this tutorial we will be showing how to create an amazing background blending images into a standard gradient background. For this we will be using the color dodge tool and a gradient mask in Photoshop CS5. We will then combine a few CSS tricks to create our background for a website. When Completed we should have a back ground… (more…)

CSS: Staggering Images down a page

In this tutorial we will show you a simple way of staggering images as they go down your website. With this method if you wish to control the position of a particular photo you still can with inline CSS, however if you do not style a particular image the CSS will automatically stagger your images down the page. The images… (more…)

CSS: How to Create a Staggered Menu Layout

In this tutorial we will learn how to create a staggered menu using only CSS. Sometimes we want to break up the structure of a website to give it character and staggering a menu up and done or left and right is one possible way to do this. Usually this is done with images and CSS which is not very… (more…)

Working with Images on your Website: Reducing Bandwidth

We all know that the biggest killer of bandwidth on our websites is the use of images, but how do we go about reducing this. What tricks can we use to create the same effect but without the expensive bandwidth totaling up rapidly on us. In this tutorial we will look at a number of methods available to us to… (more…)

CSS: Making Column Backgrounds Full Height Liquid Layout

A common problem encountered by web developers first starting out is making the background of all their columns go full height. Often when we give say our left column one background and our content another the left column’s(or right column) background does not go all the way to the bottom of the page. This throws out the look of the… (more…)

1 2 3

  • Ripper Web Design