CSS Library: DIVs and containers: Here
Curly Corner Container
Author: Dynamic Drive
There are countless techniques on the web for adding curly/ round corners to DIV containers. The below shows one way to add a curly lower right corner to any DIV on your page. It does so by using relative positioning to slightly offset a DIV to the right and bottom, so its background image, which is a curly image, falls inline with the border of the outer DIV.
Demo:
Some title
Some text here.Some text here. Some text here.
Some text here.Some text here. Some text here.
Some text here.Some text here. Some text here.
Some text here.Some text here.
Some text here.Some text here. Some text here.
Some text here.Some text here. Some text here.
Some text here.Some text here. Some text here.
Some text here.Some text here.
The image:
The CSS:
Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.
Comment Pages 3 of 3 pages < 1 2 3
hola ps pueden mejora los scripts y darle mas estilo, seria mas comercial
thank you for the code. Its been very useful. We've used a heavily reworked version of this container on our website for the left hand nav. The corner has been taken and a image background slotted in at the top, then a ul li list in there. Seems to work pretty well across browsers.
Thanks for css this tutorial. Easiest way to generate round corner: http://www.roundz.net
How can we change this script and insert images on the four corners.. i tried it but i am not good at it.. if you are able to do it then please help..
Commenting is not available in this weblog entry.