[SOLVED] rounded corners, centre column ?

[Malk]

anyone know how you would go about rounding all the corners of the centre column ?

thanks in advance

[Snade]

Hi

there are 2 ways to do this.

1. Using css3 - Since css3 is not supported by older browsers, I suggest you to use http://css3pie.com/. This will let you run it in old ie

 

2. Making the border using backgrounds - wrapping your content in 3 divs (if it will only expand in height), then adding background for the top, middle(with repeat) and bottom part of the content.

 

let me know if you need further help

[Malk]

hi snade thanks for your response

i actually just found a way to do it in the global.css by adding this on line 303;

border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; -webkit-border-top-right-radius: 8px; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; -webkit-border-bottom-left-radius: 8px

works perfectly in Firefox & Safari, am yet to see in Internet Explorer, fingers crossed

[Malk]

PS. it also works in the product.css for the product images

[Snade]

Malk, as I said for option 1., you can use CSS, but it wont work on older IE

 

 

In order to use

border-radius: 8px 8px 8px 8px; -moz-border-radius: 8px 8px 8px 8px; -webkit-border-top-right-radius: 8px; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; -webkit-border-bottom-left-radius: 8px

in all browsers, you need http://css3pie.com/ or something similar

 

ps. Yes it will work in any css file to any element with a border. But you need to understand that border-radius is CSS3 property, and its not supported by older browsers.

 

In order border-radius to work, you need to transform it into javascript for where it is necessary(for old ie). Thats exactly what css3pie does.