What's wrong with my css?

[dx3k]

hey i have used the same code to align my text as i usually do and it has made the text appear as it has in the screenshot, it does exact same in ie aswell here is the code i am using

/* CSS Document */
body {
	background: #ccffcc;
	padding: 0px;
	margin: 0 auto; 
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 9px;	 }
	
	
#holder  {
          position:absolute;
		  top: 5px;
		  right: 210px;
          width: 600px;
		  height: 700px;
		  background-image: url('images/borders.gif');
		  }	
	
#nav {
      margin-top: 320px;
	  margin-left: -500px;
	  }
	  
#date {
       position:absolute;
	   left: 200px;
	   top: 3px;
	   color: #FFFFFF;
	   }	  
	  
	  
a.nav  {
    display: block;
	font-size: 9px;
	width: 87px;
	height: 25px;	
	font-family: Verdana, sans-serif;
	margin-top: 5px;
	margin-left: 5px;
	text-align: center;
	color: #ffffff;
    text-decoration:none;
	padding-top: 4px;
	float:left;
		
		}
		
a.nav:hover  {
             border-left: 2px solid #cccc33;
			 border-right: 2px solid #cccc33;
             text-decoration: none;
			 }
			 
#text  {
        position:absolute;
		top: 400px;
		left: 355px;
		margin-right: 500px;
		
		
		 }

i have attached a screenshot of the effects

any ideas??

thanks dx3k

 

[greg76]

Everything is ok with your css, but the text itself is not that good.
You did not place any spaces in that long word, therefore it is treated as ONE word.

No css, tables, layers will help here. Just put spaces to cut this long a** word to many words and the problem should go bye bye.

Cheers,
Greg