PDA

View Full Version : CMS Article Preview .css


ar15dcm
06-28-2012, 10:53 AM
Hi,

I ran accross some .css code to apply some radius corners and gradients to my cms article previews. I have added the following to the addtional.css

.gradient {
background-color: #444444;
background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999));
background-image: -webkit-linear-gradient(top, #444444, #999999);
background-image: -moz-linear-gradient(top, #444444, #999999);
background-image: -ms-linear-gradient(top, #444444, #999999);
background-image: -o-linear-gradient(top, #444444, #999999);
background-image: linear-gradient(top, #444444, #999999);
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorStr='#444444', EndColorStr='#999999');
width: 100%;
height: 100%;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
border: 5px solid grey;
}

.wrapper {
position: relative;
margin: 0 auto;
width: 700px;
height: 200px;
}

.ie9.wrapper {
overflow: hidden;
border-radius: 30px;
border: 5px solid grey;
}

.ie9.wrapper .gradient {
border: 0;
}



But the other thing that needs to be done is adding (I assume) this to the vbcms_content_article_preview;

<!--[if IE 9 ]> <div class="wrapper ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <div class="wrapper"> <!--<![endif]-->
<div class="gradient round"></div>
</div>

I got the code from this site; http://timmywillison.com/2011/Gradients-plus-border-radius-in-IE9.html

Any help would be greatly appreciated as I am not sure if I am on the right track

Thanks,

Dean

--------------- Added 1340945697 at 1340945697 ---------------

Can anyone help me with this ?