1 reply to this topic

[gabriel-tdc]

Bom, o proprio titulo ja diz,
eu to com duvida, de como alinha um texto no inferior da div, junto com uma imagem,



(Na imagem eu fiz exatamente o que queria)

<div id="produtos">
                  <div class="prods">
                  
                  	<div class="title">
                        	Produto 1
                        </div>
                        <div class="content">
                        	<img src="imagens/prods.jpg" width="100" height="135" border="0" align="left" />
                              <p>Produto</p>
                              <p>120W<br />
                              20~30ºC<br />
                              20kg/h</p>
                              
                              
                              
                              
                             <p>Detalhes >></p>
                        </div>
                        
                  </div>
</div>

#produtos {
	clear:both;
	height:auto;
	height:172px;
}

.prods{
	width: 228px;
	height:172px;
	background:url(../imagens/produtos.png) center top no-repeat;
	float:left;
	margin-right:15px;
}

.prods .title{
	width:229px;
	height:21px;
	text-align:center;
	line-height:21px;
}

.prods .content{
	width:219px;
	height:151px;
	margin-left:auto;
	margin-right:auto;
}

.content p{
	margin:0px;
	padding-top:8px;
}

.content img{
	padding:8px;
	padding-right:5px;
}

Como eu devo fazer?
criar uma div soh pro "detalhes"? existe um atributo especifico pra isso?

position:absolute com bottom:0px; nao funciona, o texto some ;S

Agradeço a atenção o/

Edição feita por: gabriel-tdc, 23/01/2012, 15:27.

[Mika-san]

É o absolute mesmo que você tem de usar colocando em uma classe só no parágrafo do detalhes, porém ele só vai funcionar do jeito que quer se acrescentar um position:relative na classe content