Anonymous

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>


<style id="cardStyles" type="text/css">
/*
<!--************************************************************************-->
<!--* Playing Cards with CSS Demo                                          *-->
<!--*                                                                      *-->
<!--* Copyright 2001 by Mike Hall                                          *-->
<!--* Please see http://www.brainjar.com for terms of use.                 *-->
<!--************************************************************************-->
 */
/******************************************************************************
* Styles for playing cards.                                                   *
******************************************************************************/
 

.card {
  border-color: #808080 #000000 #000000 #808080;
  border-width: 1px;
   border-style: solid;
   font-size: 20pt;
  font-family: sans-serif;
  width:  3.7em;
   height: 5.0em;
  float: left;
  display:inline;
 }

 
.front {
  background-color: #ffffff;
  color: #080808;
  position: relative;
  width: 100%;
  height: 100%;
}
 
 .face {
  border: 1px solid #000000;	
  position: absolute;
  left: 0.5em;
  top:  0.6em;
  width:  2.6em;
  height: 4.0em;
  
}
.index {
  font-size: 50%;
  font-weight: bold;
  text-align: center;
  position: absolute;
  left: 0.25em;
  top:  0.25em;
}

.index2 {
  font-size: 50%;
  font-weight: bold;
  text-align: center;
  position: absolute;
  right: 0.25em;
  bottom:  0.25em;
}
 
.spotA {
  text-align: center;
  font-size: 250%;
  position: absolute;
  left: 0.45em;
  top:  0.45em;
}
 

.spot1 { position: absolute; left: 0.60em; top: 0.5em; }
.spot2 { position: absolute; left: 0.60em; top: 1.5em; }
.spot3 { position: absolute; left: 0.60em; top: 2.0em; }
.spot4 { position: absolute; left: 0.60em; top: 2.5em; }
.spot5 { position: absolute; left: 0.60em; top: 3.5em; }
 
.spot6 { position: absolute; left: 1.55em; top: 0.5em; }
.spot7 { position: absolute; left: 1.55em; top: 1.0em; }
.spot8 { position: absolute; left: 1.55em; top: 1.25em; }
.spot9 { position: absolute; left: 1.55em; top: 2.0em; }
.spot10 { position: absolute; left: 1.55em; top: 2.25em; }
.spot11 { position: absolute; left: 1.55em; top: 3.0em; }
.spot12 { position: absolute; left: 1.55em; top: 3.5em; }
 
 
.spot13 { position: absolute; left: 2.50em; top: 0.5em; }
.spot14 { position: absolute; left: 2.50em; top: 1.5em; }
.spot15 { position: absolute; left: 2.50em; top: 2.0em; }
.spot16 { position: absolute; left: 2.50em; top: 2.5em; }
.spot17 { position: absolute; left: 2.50em; top: 3.5em; }
 
 
.spades { color: #080808; }
.hearts { color: #ce1010; }
.clubs { color: #0f7600; }
.diams { color: #0f25ed; }
 
/******************************************************************************
* Miscellaneous styles.                                                       *
******************************************************************************/
 
body {
  background-color: #40a040;
}
 
 
</style>

 
</head>
<body>

<div class="text" style="float:left;">
asdfasfdasfdasfafs
</div>

<div class="card">
<div class="front spades">
<div class="index">A<br/>&spades;</div>
<div class="index2">&spades;<br/>A</div>
<div class="spotA">&spades;</div>
</div></div>
<div class="text" style="float:left;">
asdfasfdasfdasfafs
</div>
<p>i want this text at the end
</body>

</html>