Group items tagged

This page shows how to add an image to your css background. I think a lot f us will be doing that for our designs

This is an awesome site that breaks down the science of each css tool. It gives a simplified explanation and easy to understand examples of how your code will change the visuals of your page. I will use this for reference in the future.

An everything-you-need/want-to-know source for css

Paul OB gives probably the best advice I've heard yet - keep it simple. In this article he goes through the problems of complicated code, which as we all know can disable stylesheets and drive you crazy. After reading this, I went back through my css and made sure everything was streamlined.

This article, written by Alan Pearce for A List Apart magazine talks about how to implement a multi-column layout. I want to use three columns for my Zen CSS page, so I'll be using this trick for sure. I hope it's useful.

Designer Jean Louis gives a pretty cool tip about sizing text without pixels. It's one of those tricks that makes text fit according to your site. Using percentages next to the body div on css will enable you to do this. I'm going to try it when I design my next site while playing around with text.

Here is a little something extra to add to your page. Using the css code provided, you can format the cursor on your page. Cool!

All about fonts and CSS. If you have any friends how are graphic artists, then you know that fonts are a big deal to them. They somehow many to become addicted to fonts...

This article will help you convert your website designed in photoshop to a real css layout. For many people like myself who can't draw for their lives, I like to use photoshop and similar programs to plot out how I want things to look first. It is usually hard to translate my ideas onto paper, and even harder to translate the paper to a webpage. For those of you with troubles like these, rest them aside.

This is specialy for Web Developers and Design because they are using very much JavaScript for make more beautiful our UI (User Interface), JavaScript can add a lot of special effects that can really improve the user's experience, when we add JavaScript/jQuery techniques that add an extra dose of usability to any UI (User Interface/Webpage), we need to figure out more practical styling and functionality techniques to provide a great user experience, in whole package we are using CSS, JavaScript and jQuery libraries.

If you would like to play around with an HTML document without damaging your own, check out the W3C Schools CSS Guide where you can edit text on one half of the screen and watch the results unfold on the other. I am using this in the lab now so I can get some practice without exchanging files and refreshing the page constantly.

awesome tutorials for everything imaginable with css and html and various languages

This article by Trenton Moss instructs designers to use 3-d effects for objects. Apparently it's an old trick, but I still think it's cool to move a mouse over an object or image and have it pop out at you. Moss also provides the "Text-Transform" command, which is useful if you forget to capitalize successive h1 lines - it sets a standard for every h1 (every header will therefore begin with a capital letter, even if you forget to be consistent).

"Faux Columns" by Dan Cederholm of SimpleBits discusses "[a] simple way to make CSS columns appear equal in length, regardless of the content that they contain." This technique requires a good amount of skill in positioning elements on a page and understanding the nuances of the background image. Found at: Zeldman and A List Apart I'd like to try it, but don't anticipate using it any time in the near future..

I found this site from a google search: "css image icon horizontal list." I was looking for a way to use images in a list." While the search was fruitless in this respect, it explains, in detail, how to hadnle a variety of lists. Examining the code may be helpful in deciphering why your lists may/may not be working as you desire.

This is an awesome list of tricks that supplies the code and what your text and page will look like after. I plan to use many of the tricks on this page especially number 7 for the layout of my zen garden site.

Snook says that if your are trying to keep track of headers in your css, try to declare specifications all in one line. I might try to do this in the future when I get better at designing; describing an h3's colors, font size and background in one single line.

I don't know about you, but clear and float confuse me. This site is helpful in distinguishing when to use these functions. It also explains why these properties are needed.

HTML Dog has probably been the most useful tool in this whole ordeal for me. Here, in the intermediate tutorial, Patrick Griffiths explains the difference from the ID and the div tags. ID tag's identify a particular rule, whereas divs describe classes. Though not vital information, this can probably help alleviate some frustration, and for that, it's worth checkint out.

This list-o-matic website, used ironically enough, to create lists on your webpages, is exceptionally useful, if you haven't used it yet. It is found on the accessify.com site, and you can copy/paste the url at the top of this window. I may be using it for my page.