Creating Shapes With CSS Borders

I’ve been working on a site the last couple of days where my design calls for some large blocks of color that aren’t in rectangular shape. I didn’t want to use images for those trapezoidal shaped blocks, in part because I prefer to use code whenever I can to save download time and in part because using images would reduce the fluidity of the design somewhat. Fortunately the css border property comes to the rescue and with it the ability to create shapes other than simple rectangles. Add some JavaScript and the results can be pretty amazing.

Continue reading

Centering With CSS: Web Pages And Block Level Elements

The question of how to center a css layout in the browser window comes up very often. Seems to show up daily in the webmaster forums I visit and I thought it about time I devote a post to centering web pages that use a css layout. The same technique used to center your entire page will also work to center any block level element within the layout so if you learn it you’ll be able to center anything you want inside your css layouts. It’s also rather simple to learn and use.

Continue reading

My Development With CSS

How do I learn css? I see the question all the time from developers who have become convinced that css has many benefits and that developing sites with a css layout has many advantages over building a site with a table based layout. To help with the learning curve I wanted to share my own development growth with css.

Continue reading

5 Tips To Improved CSS

Yesterday I came across My 5 CSS Tips by Mike Rundle and while I generally agree with his advice I differ on some points and thought why not add some of my own thoughts and practices to the mix. I agree too with Mike when he says that different css coders have different styles and while I too won’t call these best practices either they do work for me and will hopefully help you.

Continue reading

Simple Navigation Bar With CSS And (x)HTML

Last week I showed how you can create a simple menu using an (x)HTML list and CSS. Today I thought I’d use the same technique to create a simple navigation bar. Once again we’ll structure things with a list of links and use some CSS to turn that list into a navigation bar.

Continue reading