Problema con padding-top

[wallro]

Hola! estoy trabajando en un diseño y me ne he topado con un problema con la propiedad padding.

Tengo una lista desordenada con varios items dentro de un div contenedor, al aplicar la propiedad padding-top de css para separa un poco los items del borde superior del div, el borde los items se salen fuera del contenedor.

una descripcion gráfica:


el código html es:

Código:

<div id="timehead">
	<ul>
		<li><a href="javascript: void();">Lo &uacute;ltimo</a></li>
		<li><a href="javascript: void();">Lo m&aacute;s visto</a></li>
		<li><a href="javascript: void();">Lo mejor valorado</a></li>
		<div class="clear"></div>
	</ul>
</div>

y el css:

Código:

#timehead{
	width:650px;
	margin: 15px 0px;
        border: solid 1px #BFBFBF;
	background-color: #F1F1F1;
}
#timehead ul{}
#timehead ul li {
        display: block; 
        list-style:none; 
        border: dotted 1px #a5c8e6;
        float: left;
}
#timehead ul li a{
        width: 60px;
        padding-top: 30px;
        color:#0099FF;
        text-decoration:none;
        border: solid 1px #000;
}

Lo ideal sería que el borde de los los items comenzara desde el borde del div contenedor, definitivamente me estoy equivocando en algo, espero puedan ayudarme.

Saludos.

[cristian_cena]

No te entiendo bien pero:

Antes que nada limpia tu flotado con:

Código CSS:

#timehead ul{overflow:hidden}
 

a los "li" podes darle un height igual que a los "li a" para ello -> pasa tus enlaces a bloque:

Código CSS:

#timehead ul li a{ display:block; /*... etc ...*/}
 

Luego como diste height puedes controlar el interlineado del enlace con la propiedad line-height.

Otra alternativa es que des position relative a tus "li" y position absolute + left:0; bottom:0; a tus "li a"

Saludos.

[wallro]

Funciono perfecto! solo fue necesario hacer los primero:

a los "li" podes darle un height igual que a los "li a" para ello -> pasa tus enlaces a bloque

Muchas gracias!