Layout com TABLELESS

[klaulins 0]

Pessoal, estou tentando fazer um layout (tableless), mas estou encontrando dificuldade pra posicionar os elementos. O layout é o seguinte:

 

• Uma foto (70x70), do lado direito de foto, teria quatro cx de texto sendo cada uma com uma formatação e a 4ª caixa teria texto com uma cor de fundo.

 

*Detalhe, essa descrição acima é somente uma coluna, pois terei 3 cojuntos desses elemente na horizontal.

 

 

O XHTML seria assim (creio eu)

 

<div id="foto">Foto</div>

<div id="cd">Nome do CD</div>

<div id="album">Nome do album</div>

<div id="precoUm">Preço 1</div>

<div id="precoDois">Preço 2</div>

 

 

Como formataria isso com CSS?

 

Valeu

 

Claudio Lins

[micox 2]

1) tableless não é igual a "festa de divs" hehe

2) Se a foto for importante pro conteúdo ela deve sim ser colocada em uma tag IMG e não há necessidade de div nela.

3) títulos devem ser colocados em H1, H2 e assim sucessivamente

4) Leia alguns tutoriais pra começar a se situar melhor nesta questão de semântica. Tableless não é só trocar tables por divs.

 

Como ficaria esse lance seu (1 das formas):

<img src="afoto.jpg" /><h3>Nome do CD</h3><p>Nome do album</p><p>preco </p>

Existem diversas outras formas, dependerá da função de cada elemento (que eu não sei e chutei). Talvez seja melhor você fazer com listas DT, listas UL, etc. Existem mil formas, mas não se esqueça da semantica.

 

Pra posicionar a foto do lado direito é só dar um float: right nela.

 

Visite os links que tão pendurados aqui pra você se aprofundar mais nas WebStandards. http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

[Giovani 104]

Pesquise no maujor. Lá você encontrará as respostas que prcisa. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Dá uma pesquisada sobre divmania também....ai você vai entender o que o mico quis dizer com "festa de divs" .

 

[]´s