Adapted from an idea at aplus moments

Boxes with Rounded Corners


Floated

This little box is floated to the right.

Widthless Box

These boxes use the minimum amount of semantically meaningful markup. Using CSS and the same four images for the four corners, sizes and colors are specified in the CSS. The box sizes are fluid, depending on the width of the viewport. All text can be resized using the View -> Text Size or Zoom browser controls.

This box has no width specified. Instead, its size is constrained by left and right margins of 20 percent. Change the width of the window to see how this works.

 

This box has a blank heading. It has a width of 100 percent.