http://www.positioniseverything.net/
CSS Swag: Multi-Column Lists One of the minor holy grails of XHTML and CSS is to produce a single, semantically logical ordered list that wraps into vertical columns. The ideal situation, in my view, would be a single XHTML list whose wrapping is controlled entirely by CSS. Further, the wrapped list should tolerate text resizing (easily accomplished by styling everything in ems). CSS and the browsers that support it don’t yet provide us with “vertical wrap,” so we have to augment basic list markup with additional attributes and styling rules to achieve the effect.
Essential bookmarks for web designers and web developers The project 'Essential bookmarks for web-designers and web-developers', previously updated on this page, has a new url ( a new design, a new hierarchical structure and, of course, new web-dev-resources. The reason for changing the basic concept of this project was a huge number of suggestions and links, which have overflooded my mailbox recently. Over the last few days, a new project was created and updated. The old version (which also will be updated in future) is still available on the page "Bookmarks: Maxi edition". You are welcome to submit your own links to the directory, filling out this form; besides, I'll be glad to receive feedbacks, comments and new ideas coming from your side.
Categories Cascading Style Sheets are used to define the presentation layer of websites. How CSS works is not always self-evident, so many of these articles explain various aspects of using CSS. Cutting down on vendor prefixes Fixed Width Layouts Versus Liquid Layouts - CSS Web Layouts How to Decide Which Design Style is Right for Your Site Web page layout can be done in two different ways: Fixed Width Layouts These are layouts where the width of the entire page is set with a specific numerical value.
Page Layout About the CSS Layout Generator The CSS Layout Generator was first released by Tony Aslett in October 2003, since then over 871,000 layouts have been generated. Updated in November 2010, HTML5 doctype can now be selected and a simple HTML5 template with appropriate tags will be created. Eric Meyer: CSS CSS Work Books by Eric Including Smashing CSS, CSS: The Definitive Guide, Third Edition, CSS Pocket Reference, and Cascading Style Sheets 2.0 Programmer’s Reference, among several others. Articles by Eric How to Center A Div with margin:auto in IE8 On the count of 3 everybody scream “MICROSOFT SUCKS AND I HATE INTERNET EXPLODER”. 1, 2, 3, go. note: Newer post has solutions for centering in IE9 I’ve been working on revamping my Sticky Footer code for IE8 compatibility when I ran into a little bug of sorts.
CSS tips and tricks, Part 1 As I stated in my recent article on CSS shorthand properties, I get a lot of questions about CSS from people who haven’t spent quite as much time working with CSS as I have. Their CSS is often not as efficient as it could be, and I come across some mistakes that are easy to make when you’re starting out with CSS. Since I’ve been using CSS extensively for a couple of years I’ve picked up some tricks that either make the CSS more efficient or solve a specific problem. I’d like to share my favourite CSS tricks and explain some of the most common beginner’s mistakes (of which I’ve made several). If you’re experienced with CSS you’ll have seen most of these tips and tricks before, but who knows – maybe you can find one or two you haven’t seen before.
Learn CSS Positioning in Ten Steps: position static relative absolute float 1. position:static The default positioning for all elements is position:static, which means the element is not positioned and occurs where it normally would in the document. Normally you wouldn't specify this unless you needed to override a positioning that had been previously set. 2. position:relative If you specify position:relative, then you can use top or bottom, and left or right to move the element relative to where it would normally occur in the document. Let's move div-1 down 20 pixels, and to the left 40 pixels:
Web page size and layout : Iteracy - web design and development partners in Cornwall Most web pages follow a common set of sizes and layouts, which you'll recognise even if you aren't aware of them. For example, did you know that nine out of the top ten most popular websites in the world use a fixed-width, centre-aligned design? Maybe you should too. Our article on web page size and layout breaks down web design into simple concepts, and helps you decide on a format for your website. To understand what the individual elements of a page are for, and why you need them, read our anatomy of a web page.
The Top 15 Web APIs For Your Site : New Internet Media @ Pingable.org Machine-based interaction is a common feature of Web 2.0 sites like Digg, Facebook and Dilicious, and these days it goes well beyond simple web feeds. An application programming interface(API) is what allows programmers to write applications and widgets that interact with services on these sites. The API gives them web-based access to data and functions from such sites. For example using the GoogleMaps API one could pull data and mapping information from Google that enables users of a site to view an embedded map of the location of a business.
CSS Help Pile - CSS & Standards-Related Books, Magazines - Artypapers For some time I've been thinking of adding a books section to the help pile, but that always seemed sort of useless since so many books I would have posted pretty much would have been by the same person: Eric Meyer. Now, there's absolutely no reason for me to go through and attempt to re-create his biography (which for some reason I'm tempted to do) but certainly take a look at his site and pay particular attention to the section on CSS that links to many of the great resources he's made available. You can also check out the recent Web Standards Group interview: Ten Questions for Eric Meyer. (note: Obviously many, many people are aware of Eric Meyer already, so I wasn't sure if it was even necessary to mention him on the pile, but not mentioning him created this gapping hole.) Update: I added the category after all: CSS Literature
IE7-/Win: Disappearing position:absolute boxes near to floats and clears In the following test cases a relative positioned box contains, in the source code: an absolutely positioned box (with top:7px; left:50px)a floata clear (not always present)a static box (not always present) In IE7-/Win, depending on the source order of these contained elements and sometimes on other factors like the hasLayout status of the clear and the width of the float, the absolutely positioned box may disappear. Before any case the contained elements and their source order are stated, as well as the result. 7 FBML examples to rock your Facebook fan page. - Webdistortion Facebook markup language or FBML for short is used in a variety of places within the social network. Anyone who has written any Facebook applications will already be pretty familiar with its tags, and will probably have used it to write data to walls, or share postings with others programmatically. If however you haven’t yet dipped your toe in the water of the Facebook API, or indeed haven’t actually needed to – there are some snippets of FBML which prove to be mighty useful when creating custom Facebook Fan Pages, and can easily and quickly out of the box be used with the FBML widget, which adds an extra much needed layer of customisation to an existing Facebook fan page. The static FBML widget can be added multiple times, and in multiple places (sidebar and tabs) to facilitate this. Once you’ve added it to your page, simply go to “edit page”, then under Applications click “edit” under Static FBML. This will give you the options you need to paste in your code.