CSS Library DIVs and containers
Welcome to Dynamic Drive's new CSS library! Here you'll find original, practical CSS codes and examples such as CSS menus to give your site a visual boast.
Image frames using CSS3 border-image
CSS3 makes it possible to specify an image as an element's border, instead of just a solid color. It takes a single image and then slices and dices it before using the end pieces to make up the border. Very cool!
CSS Triangle Arrow DIVs
A look at how to use CSS to produce triangles/ arrows without any image. Using this technique, 4 speech bubble style DIVs can be created using markup only.
CSS3 Rounded Corners using border-radius
Among CSS3's handy new features is the border-radius property, which offers a clean and easy way of adding rounded corners to elements on the page. The rounded corner look can be applied to any or all four corners of an element, and even works with elements with a background image.
CSS3 Box Shadows ("box-shadow" property)
CSS3 supports a new "box-shadow" property that makes it very easy to add shadows to elements on your page, such as images, DIVs and SPANs. Lets see how to take advantage of it!
CSS Gradient Shadow
This is a CSS and JavaScript technique that lets you add a shadow to most elements on your page with a customizable shadow depth and coloring. Just give the element in question a class name of "shadow" to activate the effect.
Arrow Comment Box
Using an "arrow" image, this CSS code transforms a regular DIV into a fancy "bubble" container . It's a nice interface to use for your blog's comment boxes, for example.
CSS Drop Shadows
This examples shows how to add a drop shadow to any container element using only CSS (no images). It does this by wrapping the desired content in a DIV with its background color set to the desired shadow color.













