Pessoal, estou enrolado com um aplicação web que desenvolvi a partir de um tutorial com CGI/Python e HTML/CSS. O problema é na parte de HTML mesmo, por isso postei aqui. Tentando aprimorar mais o calendário, eu quis adicionar nele os feriados do mês mostrado, em letras pequenas e na mesma célula onde mostra o dia, mas sem alterar a altura ou largura desta. O calendário está numa tabela, e sempre que tento por uma texto junto, ou ele fica misturado com o número do dia, como na imagem abaixo, ou alarga a tabela. Tentei fazer um DIV, colocando o atributo position: absolute; no <th> e position: relative; no DIV, mas não adianto. Margin, height, align, nada disso funciona, continua sempre misturado com o texto. para entender melhor, vejam o link da imagem: http://i.imgur.com/ihGJ1.png?1?5858 Pus o código aqui embaixo, é grande mas é tudo repetido, basta pular para a parte importante, o CSS e o dia 25/dez. Vejam o que pode ser feito, por favor: <!DOCTYPE html>
<html lang="pt-BR"><head><meta charset="utf-8">
<title>Calendário Dinâmico</title>
<!-- CSS/ESTILO abaixo \/ -->
<style type="text/css">
body {
line-height: 1.4em;
font-family: tahoma, arial, sans-serif;
font-size: 62.5%;
}
#data {
font-size: 170%;
}
div.holy {
position: absolute;
text-align: top, left;
font-size: 55%;
height: 10%;
margin-bottom: 90%;
}
h1 {
font-size: 270%;
}
table {
border: 1px solid #333333;
border-collapse: collapse;
}
td, th {
border-bottom: 1px solid #333333;
border-right: 1px solid #333333;
text-align: center;
width: 58px;
font-size: 175%;
font-weight: bold;
line-height: 48px;
}
th {
border-top: 1px solid #333333;
}
</style>
<!-- FIM DO CSS -->
</head>
<body><center>
<h1>Calendário do mês 12/2012</h1>
<!-- INÍCIO da tabela -->
<table><thead><tr>
<th scope="col" bgcolor="blue">seg</th>
<th scope="col" bgcolor="blue">ter</th>
<th scope="col" bgcolor="blue">qua</th>
<th scope="col" bgcolor="blue">qui</th>
<th scope="col" bgcolor="blue">sex</th>
<th scope="col" bgcolor="green">sab</th>
<th scope="col" bgcolor="green">dom</th>
</tr></thead><tbody><tr>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightgreen">1</td>
<td bgcolor="lightgreen">2</td>
</tr><tr>
<td bgcolor="lightblue">3</td>
<td bgcolor="lightblue">4</td>
<td bgcolor="lightblue">5</td>
<td bgcolor="lightblue">6</td>
<td bgcolor="lightblue">7</td>
<td bgcolor="lightgreen">8</td>
<td bgcolor="lightgreen">9</td>
</tr><tr>
<td bgcolor="lightblue">10</td>
<td bgcolor="lightblue">11</td>
<td bgcolor="lightblue">12</td>
<td bgcolor="lightblue">13</td>
<td bgcolor="lightblue">14</td>
<td bgcolor="pink">15</td>
<td bgcolor="lightgreen">16</td>
</tr><tr>
<td bgcolor="lightblue">17</td>
<td bgcolor="lightblue">18</td>
<td bgcolor="lightblue">19</td>
<td bgcolor="lightblue">20</td>
<td bgcolor="lightblue">21</td>
<td bgcolor="lightgreen">22</td>
<td bgcolor="lightgreen">23</td>
</tr><tr>
<td bgcolor="lightblue">24</td>
<td bgcolor="lightblue"><div class="holy"><a href="#f3"><small>*Christmas</small></a></div>25</td>
<td bgcolor="lightblue">26</td>
<td bgcolor="lightblue">27</td>
<td bgcolor="lightblue">28</td>
<td bgcolor="lightgreen">29</td>
<td bgcolor="lightgreen">30</td>
</tr><tr>
<td bgcolor="lightblue">31</td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightblue"></td>
<td bgcolor="lightgreen"></td>
<td bgcolor="lightgreen"></td>
</tr></tbody></table>
<!-- FIM da tabela. Código do formulário e fim do documento abaixo \/ -->
<form method="post" action="ola.py">
<span id="data">Data: 2012-12-15</span>
<input type="date" name="message" value="2012-12-15"/><input type="submit" value="Enviar" />
</form></center>
</body></html> Agradeço desde já.