Comments on: Karate Corners: XHTML/CSS Rounded Corners http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/ Wed, 10 Mar 2010 10:29:31 +0000 http://wordpress.org/?v=2.9.2 hourly 1 By: colin http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-14014 colin Wed, 03 Mar 2010 19:26:47 +0000 http://www.kyleschaeffer.com/?p=31#comment-14014 share share... http://tinyurl.com/KarateCorners share share… http://tinyurl.com/KarateCorners

]]> By: colin http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-14013 colin Wed, 03 Mar 2010 19:23:12 +0000 http://www.kyleschaeffer.com/?p=31#comment-14013 Were have you been?! Love this, I hated the other methods of using 4 graphics and tables and whatever else. This image sprite ROCKS and is easy to adapt my image/border/color, just ONE true image. I'd tattoo this url to my arm but it's a bit long, i'll just Tweet instead. SO SIMPLE, jealous you got it first! Were have you been?! Love this, I hated the other methods of using 4 graphics and tables and whatever else. This image sprite ROCKS and is easy to adapt my image/border/color, just ONE true image. I’d tattoo this url to my arm but it’s a bit long, i’ll just Tweet instead.
SO SIMPLE, jealous you got it first!

]]> By: CSS Rounded Corners ‘Roundup’ | Look Where? Right Here! http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-13993 CSS Rounded Corners ‘Roundup’ | Look Where? Right Here! Mon, 01 Mar 2010 20:07:24 +0000 http://www.kyleschaeffer.com/?p=31#comment-13993 [...] Karate Corners [...] [...] Karate Corners [...]

]]> By: Abhinav http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-13821 Abhinav Sun, 07 Feb 2010 06:13:13 +0000 http://www.kyleschaeffer.com/?p=31#comment-13821 The easiest and shortest way I've seen till now. Thank you... The easiest and shortest way I’ve seen till now.

Thank you…

]]> By: omkar http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-13730 omkar Thu, 21 Jan 2010 04:34:18 +0000 http://www.kyleschaeffer.com/?p=31#comment-13730 Simple gr8 ....... Simple gr8 …….

]]> By: Create a DHTML Tab Strip / Kyle Schaeffer's Web Design Blog http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-2/#comment-13724 Create a DHTML Tab Strip / Kyle Schaeffer's Web Design Blog Tue, 19 Jan 2010 21:49:27 +0000 http://www.kyleschaeffer.com/?p=31#comment-13724 [...] that the demo also utilizes Karate Corners to create rounded edges on the tabs. Learn more about Karate corners here. Share this [...] [...] that the demo also utilizes Karate Corners to create rounded edges on the tabs. Learn more about Karate corners here. Share this [...]

]]> By: Comba http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-1/#comment-13606 Comba Mon, 11 Jan 2010 08:56:47 +0000 http://www.kyleschaeffer.com/?p=31#comment-13606 Kyle, It seems IE 6 that Im running is not displaying the correct border on Bottom-Left, Bottom-Right and Top-Right. I think it has something to do with background-positioning. It displays the Top-Left corner on all the rest of the corners. Do you think its a syntax problem? What should I look out for? Kyle,

It seems IE 6 that Im running is not displaying the correct border on Bottom-Left, Bottom-Right and Top-Right. I think it has something to do with background-positioning. It displays the Top-Left corner on all the rest of the corners. Do you think its a syntax problem? What should I look out for?

]]> By: JoKie http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-1/#comment-13594 JoKie Sat, 09 Jan 2010 11:49:45 +0000 http://www.kyleschaeffer.com/?p=31#comment-13594 Kyle, I set the top and left attributes to -3px, but now i have the problem that the images get drawn behind the border :S Is there a solution to this problem? Kyle,
I set the top and left attributes to -3px, but now i have the problem that the images get drawn behind the border :S
Is there a solution to this problem?

]]> By: Skokov Ilja http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-1/#comment-13258 Skokov Ilja Fri, 11 Dec 2009 16:08:29 +0000 http://www.kyleschaeffer.com/?p=31#comment-13258 Спасибо за информацию! Спасибо за информацию!

]]> By: Kyle http://www.kyleschaeffer.com/tutorials/karate-corners-easy-rounded-corners-xhtml-no-script/comment-page-1/#comment-13146 Kyle Fri, 20 Nov 2009 14:32:31 +0000 http://www.kyleschaeffer.com/?p=31#comment-13146 Jyotish, That's a great question! To use this technique with a border, first you'll have to create a corner image with the correct border color on your corners. Essentially, you'll create a circle with a "stroke" around it that is the same color as your border color. Next, because the corner images will actually be displayed INSIDE the box's border, you'll have to adjust your corner DIV positioning to compensate. For instance: .TL { top: -1px; left: -1px; } In the above example, I would bump the top-left corner DIV out by 1 pixel, assuming the width of your border is 1 pixel. I hope this helps! Jyotish,
That’s a great question! To use this technique with a border, first you’ll have to create a corner image with the correct border color on your corners. Essentially, you’ll create a circle with a “stroke” around it that is the same color as your border color.

Next, because the corner images will actually be displayed INSIDE the box’s border, you’ll have to adjust your corner DIV positioning to compensate. For instance:

.TL { top: -1px; left: -1px; }

In the above example, I would bump the top-left corner DIV out by 1 pixel, assuming the width of your border is 1 pixel. I hope this helps!

]]>