Resources for Web Development Students @ Robin’s Blog

I was hunting around for a site that included information on the default spacing between block level elements in HTML. This has proven to be difficult to find since browsers tend to be inconsistent in their display. We’ve explored this issue of inconsistency in class and on the blog. I will point you to a couple of archive posts:

Common CSS Hacks
CSS Tips from Mani

If you read the above articles you may realize that resetting all margins and padding can be rather, uh, drastic and it’s not something you want to apply to a document that has already been styled. Resetting the margins and padding should be done before any other styling occurs. The code for resetting the margins and padding on all elements on a page is:

[code lang="css"]
* {
margin:0;
padding:0;
}
[/code]

Yesterday I was working with David R. He had a div that contained an unordered list (ul). The list was indented by 1/2″ which is the default spacing and he wanted to remove the indentation. He attempted to add a margin: 0; to the div, but that did not work. Instead we applied the following rule to the ul.

[code lang="css"]
ul {
margin: 0;
}
[/code]

This removed the 1/2″ indentation from all of the unordered lists on the page. David can then adjust the margin value to suit his design needs.

You can use this margin reset on any element that may have indentation or other spacing you may want to eliminate.

While I was hunting I did find a few other sites I thought you might enjoy.

Alsacreations has a series of XHTML and CSS tutorials.

HTML Dog is another excellent site for learning HTML and CSS.

Brainstorms and Raves has been one of my favorite sites for a long time. I found the article today Semantics, HTML, XHTML, and Structure. I think everyone would benefit from reading this one.

We talked about Elastic layouts the other day, so how about Jello layouts.

There is a new CSS Cheatsheet. Looks like this one is a keeper!