addressalign-toparrow-leftarrow-rightbackbellblockcalendarcameraccwcheckchevron-downchevron-leftchevron-rightchevron-small-downchevron-small-leftchevron-small-rightchevron-small-upchevron-upcircle-with-checkcircle-with-crosscircle-with-pluscrossdots-three-verticaleditemptyheartexporteye-with-lineeyefacebookfolderfullheartglobegmailgooglegroupshelp-with-circleimageimagesinstagramlinklocation-pinm-swarmSearchmailmessagesminusmoremuplabelShape 3 + Rectangle 1ShapeoutlookpersonJoin Group on CardStartprice-ribbonShapeShapeShapeShapeImported LayersImported LayersImported Layersshieldstartickettrashtriangle-downtriangle-uptwitteruserwarningyahoo

CSS Positioning Tutorials on the Web

CSS Positioning seems to be the thing that causes most newcomers the most grief. Heck it might even be doing the same for yall skilled designers. I dunno. So I found some really cool CSS Positioning tutorials on the web.

Now the way I've got them listed are demonstrations first. These have examples as you go along so you can see just what's up. Then I get to the ones that explain why something had to be done a certain way. So please enjoy.

Learn CSS Positioning in Ten Steps

CSS Layout Techniques: for Fun and Profit

Relatively Absolute

Float Layouts

CSS Positioning


Eric Meyer's Hold open a div

Same Height Columns!

Same height columns, when the content is different has been something we've been looking for since we started the page. So go here, it does work:

Equal Height Columns using CSS by Ed Eliot

Additionally Google is your friend. I've not checked out the others since the one by Ed works mostly pretty well. But more will be posted as soon as we find out how they work. Comments and changes to this page are WELCOME.

Glen Skorko writes:
I was reading through the posts on the Ed Eliot link you emailed and there is one by a gentleman named Mathew James Taylor. Mr. Taylor offers another solution for same height columns that is:
1. Simpler
2. Needs no browser-specific hacks!
3. Doesn't use JS
4. Is flexible for almost any layout or design
5. Has been tested in virtually every browser
6. Validates as XHTML 1.0 Strict
7. Doesn't need any background images
8. Furthers SEO
9. Can be accomplished using pixels, ems or percentages

This particular topic has always been an issue for me and I just wanted to share what I found. Mathew James Taylor's solutions can be found at http://matthewjamesta.... There are many other valuable examples and solutions on his website that our CSS / HTML members may find valuable!

Table of Contents

Page title Most recent update Last edited by
HTML vs. XHTML July 31, 2008 6:36 PM former member
Gimp Tutorials July 28, 2008 4:08 PM former member
CSS Positioning Tutorials on the Web September 4, 2008 3:27 PM former member
About US May 17, 2008 12:07 AM former member
Screencast Experiments May 17, 2008 12:11 AM former member
Screencasts May 16, 2008 11:55 PM former member
Sandbox May 17, 2008 12:41 AM former member
Group Photo Attribution May 14, 2008 8:32 PM former member
licensing May 11, 2008 2:26 PM former member
Getting Started May 11, 2008 1:47 PM former member
Mailing List May 11, 2008 2:39 PM former member
Messages July 21, 2008 3:41 PM former member

People in this
Meetup are also in:

Sign up

Meetup members, Log in

By clicking "Sign up" or "Sign up using Facebook", you confirm that you accept our Terms of Service & Privacy Policy