GoFuckYourself.com - Adult Webmaster Forum - View Single Post

03-17-2009, 02:32 PM

I noticed in a few designs, making elements have rounded corners on say an h1 tag instead of square corners like adding borders do. They style the h1 tag to have a rounded corner image infront of the content, and then style a span tag to have a rounded corner image behind the content and then just do <h1><span>something</span></h1>.

Tip:
Use the :before and :after pseudo-elements on the h1 tag with the content attribute to do it all in 1 tag.

http://www.quirksmode.org/css/content.html

Read that page, and figure it out, will make much cleaner code and less markup in the long run.

03-17-2009, 02:32 PM
Killswitch - BANNED FOR LIFE Guest Posts: n/a	CSS tip of the day. I noticed in a few designs, making elements have rounded corners on say an h1 tag instead of square corners like adding borders do. They style the h1 tag to have a rounded corner image infront of the content, and then style a span tag to have a rounded corner image behind the content and then just do <h1><span>something</span></h1>. Tip: Use the :before and :after pseudo-elements on the h1 tag with the content attribute to do it all in 1 tag. http://www.quirksmode.org/css/content.html Read that page, and figure it out, will make much cleaner code and less markup in the long run.