pictures

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

hr
hr

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.

hr

Related Posts

Comments, Pingbacks and Tracebacks

(Comment icons use gravatars. Sign up for a gravatar so you can be cool too.)

hr

Leave a Reply


search

subscription information

Blog RSS

Comments RSS



Powered by FeedBlitz

blog categories

blog tags

most popular posts

  1. jappler recommends: room & board (store).
  2. using parallels and windows for web development debugging.
  3. another good first tuesday in november.
  4. remove all .svn directories in a directory.
  5. wordpress newsletter plugin.
  6. Add a "Pseudo" Pseudo Class Hover in Inline CSS.
  7. php live training.
  8. so long, farewell ben!
  9. css containers: one image, fixed width, rounded corners.
  10. feel better soon joe paterno.

blog archive

standards

Get Firefox!
XHTML
CSS