Pure CSS Rounded Boxes! (no images, no tables)
Rounded boxes are a very cool feature in any design. Most of them use images or tables to achieve this effect, but this solution is only CSS based, and all browsers compatible. I Adapted from Nicholls boxes code. Enjoy:
To replace only your sideboxes: 1. In skin1.css and in skin1_admin.css add this: Code:
/*Round corner sideboxes*/ 2. In menu.tpl, replace all the code with this: Code:
<div class="xrounded"> To replace your dialog boxes (center boxes): 1. Do step one above, if not done. 2. In dialog.tpl, replace all the code with this: Code:
To replace your product list boxes (boxes around each product thumb): 1. Do step one at the beggining of this post, if not done. 2. In customer/main/products_t.tpl, replace this: Code:
with this: Code:
3. In skin1.css add this (below the code in step1): Code:
.xroundedthumb h1, { I replaced all the tables with divs, to improve speed and control. Remember that you can further edit the css to use another font color, size, box width, etc. Hope it helps!! ;) |
Re: Pure CSS Rounded Boxes! (no images, no tables)
Could you post a link showing an example of this?
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
1 Attachment(s)
Here it is a sample of how your boxes will look. Of course you can edit how it looks in the CSS. 8)
Attachment 556 |
Re: Pure CSS Rounded Boxes! (no images, no tables)
Thanks for posting.
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
=D> THANK YOU for posting this!!!
You saved me from a lot of ](*,). |
Re: Pure CSS Rounded Boxes! (no images, no tables)
Thanks for sharing. Have you tried this with FireFox?
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
Is class xroundedcenter (used by dialog) not defined? I change it to xrounded and it is working fine in Firefox now. Thanks
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
Thank you for this mod!!
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
Brilliant, thanks very much. This has been on my list of jobs for a while and you have just saved me loads of time.
|
Re: Pure CSS Rounded Boxes! (no images, no tables)
I put this in my new site. But the featured products top is bad any idea?
http://onlinemacs.com/home.php |
All times are GMT -8. The time now is 12:27 PM. |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.