ANTICHAT - Показать сообщение отдельно

вот:

PHP код:


		
			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

<html> 

<head> 

<style>  



body{ 

    margin: 0px; 

    padding: 0px; 

    background: #4c4c4c; 

} 



a {color: #FFFFFF;} 

a:hover {text-decoration: none;} 



div.li {  

    color: #FFFFFF;  

    background: #00AA00; 

}  



div.li div.li1{ 

    margin: 0% 66% 0% 25%; 

    border: 3px solid #FFFFFF; 

    background: #000000; 

} 



div.li div.li2{ 

    margin: -1.8% 53% 0% 40%; 

    border: 3px solid #FFFFFF; 

    background: #000000; 

} 

</style>  

</head> 

<body>  

<div class="li">  

<div class="li1">  

    <a href="#">Новости</a>  

</div> 

  

<div class="li2">  

    <a href="#">Книги</a> 

</div>  

</div>  



</body> 

</html>

это в увеличенном виде страница. На глаз не ровности не видно. Но если поменять разршение. + в кнопках нужно чтоб рамка обтекала текст ровно. Даже при смене текста в кнопке. Что посоветуете делать?