Rounded Corners - Post ID 194818

User 142965 Photo


Ambassador
2,420 posts

With the new HTML 5 and the new Coffee Cup HTML. How easy is it to make rounded corners. I always wanted to make a box . . . . rounded corners. I like to make a thin short rounded corners for the main page of my website very soon. My website about to turn 17 on July 1, 2012.

HI JO ANN!!

My nephew got me into MineCraft game.
> CoffeeCup Ambassador
> 2002 Olympic Torchbearer
> Multiple Sclerosis Cyclist 1990 to 2015
> Eagle Scout 2008
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
< < < http://www.bikemikeworld.com > > >
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Smile Always !!

http://www.bikemikeworld.com/small-ms170-meter.gif

Direct link to donate towards my ride in Multiple Sclerosis bike tour......
http://main.nationalmssociety.org/goto/2015ms170

User 187934 Photo


Senior Advisor
20,266 posts
Online Now

http://learning-html5.info/blog/css-3-s … d-corners/
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 464893 Photo


Ambassador
1,611 posts

I have the Visual Site Designer.The best Button and Banner maker on the planet. thus rounded corners and other shapes are a breeze. Just add Web Image Studio and you are in Graphics Heaven.

Rounded corners with shadows ahh!
The Guy from OZ


User 38401 Photo


Senior Advisor
10,951 posts

Ahh, but you can do all that without any images with the new CSS3 styles. You can even do shapes and word styles with it :)
User 122279 Photo


Senior Advisor
14,616 posts
Online Now

I think Bike Mike, who asked the question in the first place, is a coder, so starting with VSD is not the way to go.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 464893 Photo


Ambassador
1,611 posts

A nice image is a clean addition if you have the means to create it. Obviously if you need to code it then do so. I believe the display is what a visitor sees. It must load fast,

border-radius: size;
-moz-border-radius: size;
-webkit-border-radius: size;
border: 1px solidcolour;

Then add shadow
#example1 {
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;
}
or just drop in a nicely constructed banner or button or whatever

<img src="image" width="48" height="62" alt="" title="" border="0" />

If I have it I will use it. If not I will get it. If it doesn't exist then I will create it. It has to be a worth while reason for me to prove I can do it.

The Guy from OZ


User 2073552 Photo


Registered User
1,625 posts

Mike to answer your question you simple add this to your CSS.

border-radius:10px;

This can be added to images, boxes, and so forth and it will give you rounded corners! SO MUCH easier then what had to be done before! Enjoy. :D
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.