Rounded Corners CSS

Out of context: Reply #3

• Started
• Last post
• 13 Responses

• Stugoo0

  off the top of my head:a few ways to do it.

  1.a. make a box with 3 rows.
  first row has background image with top repeating and inside has image floating left of top left corner and one floating right for top right.

  1.b as above but one long image, only drawback is that it is not scaleable.

  1.c as a. but use transparent pngs that invert the corner, however you have to work out an ie6 fix.

  2. make the div position:relative and absolutley position all four corners, however if i remember correctly ie6 doesnt like this method if the width of the container is an odd number.

  3. there are many javascipt solutions to this but you should never rely on JS for layout if you do you fail as a front end dev.
  

  Stugoo 0Permalink

  UpvoteDownvote

  Flag

  • js solution - only use if you explicitly state that the site will only work with js.Stugoo
  • 1a repeat for bottom row.Stugoo

  Show [[ numHiddenNotes ]] more notesAdd Note

  SaveCancel

View thread