Здравствуйте, уважаемые эксперты! Прошу вас ответить на следующий вопрос:
Сделал меню навигации по сайту на html и css, код в приложении, проблема- при уменьшении сайта (например просмотр на низком разрешении) название ссылки не уменьшается вместе с дивом пропорционально, подскажите, что можно сделать?

Приложение:
html:
<div id="menu">
<a class="podmenu" href="index.html"><p><font size="2em"><cite><strong>Главная</strong></cite></p></a>
<a class="podmenu" href="o_nas.html" ><p><font size="2em"><cite><strong>О нас</strong></cite></p></a>
<a class="podmenu" href="" >p><font size="2em"><cite><strong>Каталог</strong></cite></p></a>
<a class="podmenu" href="otziv.html" ><p><font size="2em"><cite><strong>Отзывы </strong></cite></p></a>
<a class="podmenu" href="" ><p><font size="2em"><cite><strong>Блокнот </strong></cite></p></a>
<a class="podmenu" href="contacts.html" > <p><font size="2em"><cite><strong>Контакты </strong></cite></p></a>
</div>



css:
a.podmenu{
padding:0%;
display:block;
width:70%; height:9%;
margin: 4% 12%;
border: 5px solid #ffffff;
text-align: center;
-webkit-border-top-right-radius: 20px 15px;
-webkit-border-bottom-left-radius: 20px 15px;
-webkit-border-bottom-right-radius: 20px 15px;
-moz-border-radius-topleft: 20px 15px;
-moz-border-radius-topright: 20px 15px;
-moz-border-radius-bottomleft: 20px 15px;
-moz-border-radius-bottomright: 20px 15px;
border-radius: 20px;
-khtml-border-radius: 5px;
behavior: url(PIE.php);
background: #ff9933;
z-index:3;
text-decoration:none;
color:black;
overflow:hidden;
}