The rounded corners of these boxes seem slightly thicker than the box straight lines (see attached image).
How do I make it more so the straight lines and corner thickness' match? Thanks.
Code:
/* set the image to use and establish the lower-right position */
.cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2{
background: transparent url(../images/boxcorner.png) no-repeat bottom right}
.cssbox{
/* intended total box width - padding-right(next) */
width:280px !important; /* IE Win = width - padding */
width: 280px;
float:left;
/* the gap on the right edge of the image (not content padding) */
padding-right:15px; /* use to position the box */
margin:20px auto}
/* set the top-right image */
.cssbox_head{background-position:top right;
/* pull the right image over on top of border */
margin-right:-15px;
/* right-image-gap + right-inside padding */
padding-right:107px}
/* set the top-left image */
.cssbox_head h2{
background-position:top left;
margin:0; /* reset main site styles*/
border:0; /* ditto */
/* padding-left = image gap + interior padding ... no padding-right */
padding:25px 0px 15px 40px;
*/height:auto !important;*/
height:1%} /* IE Holly Hack */
/* set the lower-left corner image */
.cssbox_body{
background-position:bottom left;
margin-right:25px; /* interior-padding right */
padding:15px 0 15px 40px} /* mirror .cssbox_head right/left */
.cssbox {
margin-right:30px; /* increase this value to suit your requirements */
}
|
