Hi, I have the following CSS and I am wondering if there is a to combine all of this into one class such that I will only need to reference the one new class in the div declaration in my html:
.roundedcornr_box_963993 {
background: url(roundedcornr_963993_tl.png) no-repeat top left;
}
.roundedcornr_top_963993 {
background: url(roundedcornr_963993_tr.png) no-repeat top right;
}
.roundedcornr_bottom_963993 {
background: url(roundedcornr_963993_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_963993 div {
background: url(roundedcornr_963993_br.png) no-repeat bottom right;
}
.roundedcornr_content_963993 {
background: url(roundedcornr_963993_r.png) top right repeat-y;
}
.roundedcornr_top_963993 div,.roundedcornr_top_963993,
.roundedcornr_bottom_963993 div, .roundedcornr_bottom_963993 {
width: 100%;
height: 15px;
font-size: 1px;
}
.roundedcornr_content_963993, .roundedcornr_bottom_963993 {
margin-top: -19px;
}
.roundedcornr_content_963993 { padding: 0 15px; }
To use this I need to do something like the following:
<div class="roundedcornr_box_963993">
<div class="roundedcornr_top_963993"><div></div></div>
<div class="roundedcornr_content_963993">
<p>Some text... etc.</p>
</div>
<div class="roundedcornr_bottom_963993"><div></div></div>
</div>
I am wondering if there is a way to combine the css classes above so that I need only right one div to get the same effect, for example:
<div class="new_class">
<p>Some text... etc.</p>
</div>
Thanks