Website Babble Webmaster Forums  


Go Back   Website Babble Webmaster Forums > Creating a Website > HTML, PHP, CSS, Javascript & Coding/Programming Topics

Your WB Notifications

Reply
 
LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 10-16-2009, 05:23 PM
Regular Babbler
 
Join Date: Jul 2009
Posts: 91
novicer has no reputation at Website Babble yet.
Default creating rounded boxes

Hey guys! does anyone know how to create a rounded box?
Reply With Quote
  #2 (permalink)  
Old 10-16-2009, 06:37 PM
James's Avatar
Super Moderator
 
Join Date: Dec 2007
Posts: 2,375
James is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation bars
Default One way...

One way is to just make a rectangle with rounded corners in a graphics program (I use Paint Shop Pro) and use it as a background image using css.

That is what I have done. It is probably the easiest.

I've read that there are dozens of ways to do this. You can make rounded corners strictly with css but it is complicated. css3 can do it with one line of code, I have read, but it is not well supported by browsers so I haven't looked at it.
__________________
Good Success!

Douglas County Master Gardeners
"We don't always get what we want, but we always get what we expect."
Reply With Quote
  #3 (permalink)  
Old 10-16-2009, 08:41 PM
TechieGuy's Avatar
Super Moderator
 
Join Date: Jul 2007
Location: Canada
Posts: 2,456
TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!TechieGuy is an exceptional WB member with over 1,000 rep points!
Default

James is right (as usual). I would use an image to display rounder corners.

As James also mentioned, CSS3 supports rounded corners using the -webkit-border-radius:[size];-moz-border-radius:[size]; definitions.

The problem with using CSS is that the above definitions are supported by Firefox but not IE. I'm not sure about the other browsers.
Reply With Quote
  #4 (permalink)  
Old 10-17-2009, 01:55 AM
Junior Babbler
 
Join Date: May 2009
Posts: 28
Talicy has a few positive reputation points
Default

Quote:
Originally Posted by TechieGuy View Post
James is right (as usual). I would use an image to display rounder corners.

As James also mentioned, CSS3 supports rounded corners using the -webkit-border-radius:[size];-moz-border-radius:[size]; definitions.

The problem with using CSS is that the above definitions are supported by Firefox but not IE. I'm not sure about the other browsers.
Yep, that's true. The effects don't work on IE yet, because it doesn't support CSS3.
Code:
-moz-border-radius
only displays rounded corners for Firefox, (notice the "moz" is probably from mozzila). However,
Code:
-webkit-border-radius
works for Chrome and Safari, as both are built from the Webkit open source project. (Not entirely sure)

The last thing about rounded corners with CSS3, or any CSS3 stuff (e.g.
Code:
@font-face
) will come out as error in validation, because it will say that this is currently an experimental feature. Even though, I use it because images are very annoying and messy (for me).
Reply With Quote
  #5 (permalink)  
Old 10-18-2009, 04:46 PM
Regular Babbler
 
Join Date: Jul 2009
Posts: 91
novicer has no reputation at Website Babble yet.
Default

Ok, thanks for all your suggestions guys.
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On




All times are GMT -6. The time now is 06:53 PM.


 Subscribe to RSS

WB Sponsors

Search Engine Optimization

flash chat

Home Jobs Online

Search Engine Marketing

Paid Surveys

Web Design Company

custom website design

Best Links Management Software

Online Advertising Solution FREE trial!



 Subscribe to the Website Babble Feeds

2 Create a Website Homepage | 2 Create a Website Blog


Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0