CSS curved corner on Google Code
It was on last year September, I wrote about making curved corner using CSS. That single post made my blog popular among web developer community and the sites linked to that post includes YUI blog and Drupal. hundreds of people bookmarked it on delicious and other bookmarking sites. A lot of English and non english sites wrote review and more explanation on the same. That all lead me to achieve 10K visits per month. This made me to think serious about blogging and hence I’ve changed the permalink url structure more meaning full and may help SEO. Thanks for everyone who are linked to curved corner post. For your information, I have also posted one more htc file which makes IE6 to work CSS pseudo class :hover. But it didn’t hit my expectations 🙁 .
Now, the good response from web developers around the globe made me think of making it more accessible for everyone, and to go with further maintenance or updations as per new issues are reported. So, I hosted it on Google Code. New version downloads will be available there. You can also report issues there so that I can keep track of it. More over, I believe this could help me to save bandwidth 🙂 .
Once more thank you all for your support and links (of course) which helped me to get 10K visits per month within 5th month of age.
Hi There
Despite this being a very usefull fix, I have been having alot of issues with the borders.
When I use javascripts to expand part of the page above an element with rounded borders, the borders stay fixed instead of moving down the page.
Also, I have ot been able to get this to work on menu items, or jQuery hidden/show div boxes.
Imagine how many trillions of hours have been wasted by the human race because Microsoft are the worlds most retarded programmers.
Keep up the good work thou :D.
Will there be any support for -top-bottom-, -left-right-?
Hi,
I tried to use your code in my website. But, it did not work on IE8 in ASP.NET. I don’t know what is reason. Did you did you try it with ASP.NET?
Any idea?
Thanks.
Will there be support for -top-bottom-, -left-right-?
border-bottom-left-radius;?
border-bottom-right-radius;?
The rounded corners techniques are evolving day by day. Hope all browsers support CSS3 fully, and render all the pages consistently! It’s such a pain to ensure the same page looks the same in all browsers. Can’t they make life easier for us?
I stumbled upon a site http://theboxes.paradise.sg. This is totally different from all those discussed so far. It’s really easy to use, but I’m wondering the same thing as usual: when browsers upgrades are out, will there be an issue?
But looking at the way it approaches the problem, one thing is sure: if there really is a problem, they just have to fix it once at their site, and everyone who is using their box will get fixed at once. That means, there’s nothing for us to do at all. Cool.
I’m not too sure what technique they use to create the box, but at least it’s consistent across all browsers at the moment, even the latest IE8.
IE seems to ignore background properties in css when using it, it shows the
image, but doesn’t seem to listen to any repeat or positioning instructions.
In the demo zip, find the css part and to repeat the issue, do this:
CHANGE THE FOLLOWING CLASS
div{
width:400px;
height:200px;
background: #000;
border:red solid 1px;
margin-bottom:20px;
color:#fff;
text-align:center;
}
TO
div{
width:400px;
height:200px;
background: url(“some-header.gif”) top left repeat-x;
border:red solid 1px;
margin-bottom:20px;
color:#fff;
text-align:center;
}
the some-header.gif is of size say, 1 X 30 (1 px width and 30px height) I want to repeat it along x to give the div a title bar look and feel. It is not working.
Can you help me? pls.. thanks.
Great idea -> I haven’t actually used it (although I’m looking at it for a current project) but what a great idea. I had no idea you could extend IE that way (of course it begs the question of why don’t they just add support themselves as a patch or otherwise).
That thingy is super great! Works very well.
This is genius! Thank you!
Best greetings from germany.
I should thank you man. I have years trying to get the sleekest rounded box for IE until now, headaches while doing with images and/or writing extra div’s or long lines of js. Though I was so happy when -mz, -webkit, and -khtml came by, so then finally css makes it standard with just border-radius (CSS 3). Unfortunately IE does not quick follow standards. But then again I’ve never realize what behavior can do so much until recently. Again, Thank you on behalf of those who already downloaded your code and remix it to do great designs even on none static pages.