css containers: one image, fixed width, rounded corners.

CSS HTML/XTML Web Development

I use reuse a number of CSS/XHTML layouts everyday and feel it is time to share. This is the third of three articles in a series on how to create various CSS rounded corner or “fancier than a simple box” container with CSS and XHTML that work in IE 6, IE 7, Firefox 1.5, Firefox 2.0, and Safari 2.0. I have used this code on several large and small sites and have enjoyed the flexibility of both changing the height and the width. (Also see css containers: simple, fixed width, rounded corners, and css containers: fancier, fixed width, rounded corners..)

There are some sites where you need to have some flexibility with both height and width of the containers. This technique is known as the “ThrashBox” and I will not go into detail about it because it is well documented: ThrashBox. If you want to use something like this, there is a great web site that offers to create the graphic needed based on your input of color, height, weight, and corner radius. Check it out:Spiffy Box.

One thought on “css containers: one image, fixed width, rounded corners.”

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Apple Hardware

My iPhone

I finally did it, I had to…I bought an iPhone and I have loved every minute of owning it. I had an appointment the second day I owned it and the person I met with wanted to “zoom the pictures like the commercials”. I also now have the ability to carry around tons of pictures […]


Busy Busy…

It is now after 8pm and I just got through my email for the day. I am not sure how it is with other self employed people, but by far Monday is always the busiest day. Time to sit back and watch some Big Love before I have to enjoy a day full of meetings. […]