Fluid and liquid layouts are definitely considered the ‘ideal’ design type right now, and I cannot agree more. I much prefer a fluid design over a set layout. For text we know that relative sizing (meaning the use of em, ex, and percentages) are preferred over the use of pixel sizing.
In a time of web developers who just like to say that ‘Tables are Evil’ and can’t (or won’t) explain why, this article will attempt to give you some solid reasons that people create tableless designs. Included are six major benefits of creating tableless sites, and how to sell your desire to alter your website to a resistant manager.
Ever seen those fancy links where they change the appearance as soon as you place your mouse cursor on them. See a simple example of a rollover effect here. The CSS definition of this simple example goes like this…
Different browsers, different CSS interpretations! There will be a time when you’ll need to hide some CSS rules from a particular browser, or even all the CSS file! In this articles I’ll try to compile all possible types of Browser detection technics and provide examples. So let’s start with the easier one!
Although I’ve written several articles that included examples of positioning, such as “Instant Info” and the “No-Kill Pop Box” series, it occurred to me that I’ve never written an article about how to do the positioning itself.
Firstly, I’ll start off by saying that this technique is only supported in the newest browsers, like Mozilla Firefox. If you’ve ever gone to a webpage and noticed a little palette appear in the bottom left, this is to switch stylesheets.
It is particularly useful to keep one css file for the entire website rather than having individual CSS styles in every page, advantage of having a separate CSS file is, it is easy to update and maintain the look and feel of the entire website from a single file. That is why it is better to create an external CSS file if you have not done so. This tutorial will show you how to convert your internal CSS styles to an external file and how to attach them to a page.
Do you want to have a different color links on different sections of your website? If your answer is yes then you have come to the right tutorial. Often websites have different color backgrounds on different sections of their website, for example content section of your website might have a white background, in contrast footer section might have a darker background color. Problem arises when you have links on the footer, default link-color is blue therefore it might not be very visible on the darker background. Luckily there is a way to solve this problem with CSS which we are going to do next.
In this tutorial you will learn how to put a fixed image background on your pages, that is the background that stays in the center of your page even when you scroll the page.
As you know there are four states of a link, namely: Initial State, Visited State, Mouse Over State and Active State. For example if you were to put the following code between <head></head> tags in the page, all the link states in that page would be red. Which means when you visit the page you will see all the links in read, and when you click on them or hover on them you will not see any change.
