Graph Paper Press

Tip Type: CSS

CSS tips

  • Developer Tools

    Have you ever wanted to change the color or size of text, find a specific html element or locate a buggy javascript file? The Developer Tools, bundled and available in Google Chrome and Safari web browsers, allows anyone to inspect the elements (html, css, js) that make up a webpage. Simply right-click on any element…

  • Using Firefox’s FIrebug

    In this tutorial, learn how to use the Firebug extension for Firefox to start learning about the back-end on your site so you can target which elements you want to change style-wise.

  • Creating Image Shadows Using CSS3

    One of my personal favorite features in css3 is the use of box-shadows. CSS (Cascading Style Sheets) is a style sheet language used to describe the look and formatting of your website. With a few quick lines in your style sheet document, we can create nice drop shadows for our html elements, like on the image…

  • Create Four Column Grid Template

    Create Four Column Grid Template

    Grids. I know you love them! They are one of the most requested design features which we typically add to most of our WordPress photo themes. In the following tutorial, I show you how to use CSS “pseudo classes” to achieve a full-page four column grid. With a few small tweaks, you could adapt the template…

  • CSS Shorthand Font Property

    There are two ways to write CSS: Longhand and Shorthand.  Both accomplish the same thing.  Using shorthand you can save keystrokes and minimize lines, which will decrease your file sizes. Example of setting your font-properties the traditional longhand way: font-size: 12px; font-family: “Times New Roman”, Times; font-style: italic; font-weight: bold; line-height: 1.4em; In shorthand, the…

  • How to Change Link Colors

    If you find you don’t like the default link colors on a theme, it’s really simple to change them with just a few lines of code. If you’re using a Graph Paper Press theme, most of our themes allow you to change colors from the Theme Options. It’s important to think about the different properties…

  • How to Add A Fixed Background Image

    If you’re using a WordPress theme that scrolls and you choose to use a background image (not a background pattern), this is imperative, that is unless you’re into your background image scrolling with your content. Having your content glide smoothly over your background image is as easy as inserting this code snippet into your style.css…

  • Change Backgrounds, Colors, Fonts on Specific Pages

    Open up any WordPress theme and inside the header.php file you will likely see this: <body <?php body_class(); ?>> The body_class() function is a neat little function that spits out CSS classes that make it easy to change the background color of your About page, for example.  It’s easy to find the specific CSS class…