Hello,

If you look at www.sandlotcards.com you'll see and an image of a baseball card. Next to it you'll see a .png image of two pieces of tape I'm attempting to overlay over the baseball card however it keeps getting put next to the card. Does anyone know why this is happening? Here is the .css

/* Cards */

div.cardbox{
display: inline;
float: left;
margin: 0px 10px 10px 0px;
background: #746949;
}

div.cardbox:before{
position: absolute;
z-index: 2;
content: url(images/card_overlay.png);
}

img.card{
padding: 10px;
}

If you view the code the html is question is here...

<div class="cardbox">

<img alt="" height="137" src="prodimages/2010_Topps_BB_Example.jpg" width="100" align="left" class="card"/>

</div>


Thanks,
ECD

What's with the <span class="t1"> ??? If it's a HEADING use a proper HX tag and style it with css to whatever you want.

Put your text in proper paragraphs. You've got a beginning <p>, text with a ton of unnecessary <br> tags. Get rid of the <br>'s and put the text in paragraphs, you can control the spacing of the paragraphs with your CSS.

As for your tape, get rid of the align="left" that you've got on the baseball card image and the tape will pull back to about where it belongs. The alignment should be in your CSS, not in your html.