itwales.com — Cascading Style Sheets are the foundation on which many of the best websites are built. Using CSS allows developers to describe the common style for the website, in terms of colours, fonts and layouts. In this tutorial, Trenton Moss of Webcredible shares some of his top tips to help you get the most from your CSS.
Jun 18, 2007 View in Crawl 4
mrsunshineJun 18, 2007
A precaution to save bandwidth and not getting taken down by Digg visitors?
thebraineaterJun 19, 2007
It's ironic because that site looks like a pile of s**t. This article is super gay. first off, the article's description is as long as f**k. say "CSS controls the colors, layout, fonts and overall styles of your site. Trenton Moss demonstrates some CSS tricks." or better yet, cut out the part telling you what css is since if you're looking at the article, you should already know. also, the headline should be "Ten CSS Tricks You Probably Know," since it's all pretty much common knowledge
davidgoldingJun 19, 2007
You could also do a search in Google using the query string "site:digg.com css" (of course you will find that CSS tips stories like this have been done before and more thoroughly than this article).
ataylor32Jun 19, 2007
height: 100% will only make it 100% of the *window's* height, not the document's height. So if the user's window is 700 pixels tall, that's what the height will be, regardless of how much longer the document is.I'm not trying to be a jerk or anything; I'm just informing you.
ooznuJun 19, 2007
Wow, how good of him to tell us to _hide_ the text, thats certainly a good choice if you are looking for trouble.5. Image replacement techniqueIt's always advisable to use regular HTML markup to display text, as opposed to an image. Doing so allows for a faster download speed and has accessibility benefits. However, if you've absolutely got your heart set on using a certain font and your site visitors are unlikely to have that font on their computers, then really you've got no choice but to use an image.Say for example, you wanted the top heading of each page to be 'Buy widgets', as you're a widget seller and you'd like to be found for this phrase in the search engines. You're pretty set on it being an obscure font so you need to use an image:This is OK but there's strong evidence to suggest that search engines don't assign as much importance to alt text as they do real text (because so many webmasters use the alt text to cram in keywords). So, an alternative would be:Buy widgetsNow, this obviously won't use your obscure font. To fix this problem place these commands in your CSS document:h1{background: url(widget-image.gif) no-repeat;height: image heighttext-indent: -2000px}Be sure to change "image height" to whatever the height of the image is (e.g. 85px)! The image, with your fancy font, will now display and the regular text will be safely out of the way, positioned 2000px to the left of the screen thanks to our CSS rule. Please note, this can cause accessibility issues as any user with images turned off won't be able to see the text.
chapiumJun 26, 2007
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<a class="user" href="http://www.w3.org/TR/html4/loose.dtd">http://www.w3.org/TR/html4/loose.dtd</a>"&gt;From the original page.
binhainaziJul 1, 2007
Well, I would like to use topstyle edit css, and use editplus edit html~
findhostcouponsMar 22, 2009
Thanks for these tricks, I really didn't know about most of them!