Snowfalls

How to Create a Rounded-Corner Box Using CSS3

Posted on: September 7, 2010

For example you have this class:

<div class=”rounded”>… Text Here …</div>

In your CSS code you could add these line to implement the rounded-corner box:

.rounded{

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

}

In which:

moz-border-radius gives you compatibility with older firefox browser

-webkit-border-radius gives you compatibility with older webkit browsers, such as Safari

border-radius is a CSS3 tag that works with modern browsers, such as Safari 5, Firefox 3.5.x, Internet Explorer 9, and Google Chrome 4

But, unfortunately these styles are not working in IE6, 7, and 8

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: