Olá pessoal, eu estou fazendo um layout em tabelas, sei que não é muito aconselhável, mas vamos lá!
O único probleminha que está acontecendo no momento é algo simples, mas que não estou conseguindo detectar, é a primeira vez que faço layouts em tabelas.
O layout aparentemente está tudo Ok, tá centralizado em resoluções diferentes e tudo mais, exceto quando vou escrever algum texto na área do conteúdo, ai aparece o problema, porque o menú que existe do lado esquerdo desce quando do lado direito eu ponho algum conteúdo. E quando eu subo o menú dando "enter" (colocando espaço) depois dos botões do menú, ai é o lado direito, onde escrevo os textos que desce...
Se eu "subir" o menú, o texto de lado desce. E se eu subir o texto é o menú que desce. Vice-versa. Quero um método que não desajeite o menú nem o texto.
Um amigo meu disse que é porque eu tenho que criar tabela dentro de tabela pra fazer o menu. E outra tabela dentro da tabela pra fazer o conteúdo do texto, em partes separadas ai esse problema se resolverá.
No meu caso eu estou fazendo uma única tabela que são colunas que separa o Menu do Texto. Vejam a imagem:
http://dl.dropbox.co...6717/layout.jpg
E vejam a situação real e o código fonte:
www.n-coisasdemim.blogspot.com
Me ajudem, ficarei muito grata.
Layout Em Tabelas
Started By :. WebGirL .:, 02/10/2010, 20:20
7 replies to this topic
#2
Guilherme Vieira
-
- Usuários
-
- 113 posts
Normal
- Sexo:Masculino
- Localidade:Fortaleza, Ceará
- Interesses:Desenvolvimento Web baseado nos padrões do W3C, HTML5, CSS3, PHP, JavaScript, jQuery, AJAX, SQL, MySQL.
Posted 03/10/2010, 00:11
Boa noite, em primeiro lugar sugiro que vc não faça seu design em tabelas, porque gera muitos erros, as células devem ser manipuladas uma a uma no código-fonte, além de ser uma técnica atrasada, o que leva aos erros de compatibilidade dos navegadores.
Tente usar HTML com CSS, de preferencia em arquivos separados para facilitar o desenvolvimento.
Maujor.com Um site excelente pra vc conhecer as tecnicas CSS.
De imdeiato, eu dei um olhada no seu código, e encontrei alguns elementos que existem(e oputros que faltam) pra corrigir seu erro.
1.Na célula amarela:
2.Adicione nas células "defeituosas" a propriedade
OBS: ná célula cinza, a simples adição da propriedade acima já serviu.
Espero que isso ajude no que vc está fazedo agora, mas igualmenteespero que evite as tabelas no design e use divs.
Em todo caso, espero ajudar, boa sorte!
Tente usar HTML com CSS, de preferencia em arquivos separados para facilitar o desenvolvimento.
Maujor.com Um site excelente pra vc conhecer as tecnicas CSS.
De imdeiato, eu dei um olhada no seu código, e encontrei alguns elementos que existem(e oputros que faltam) pra corrigir seu erro.
1.Na célula amarela:
<td width="27%" bgcolor="#CCCC00"><p>&nbsp;</p>esse parágrafo tá fazendo um espaço entre a borda superior e o texto da celula amarela. remova-a.
2.Adicione nas células "defeituosas" a propriedade
valign="top"
OBS: ná célula cinza, a simples adição da propriedade acima já serviu.
Espero que isso ajude no que vc está fazedo agora, mas igualmenteespero que evite as tabelas no design e use divs.
Em todo caso, espero ajudar, boa sorte!
- :. WebGirL .: likes this
#3
:. WebGirL .:
-
- Usuários
-
- 48 posts
Turista
- Sexo:Não informado
Posted 07/10/2010, 19:04
Obrigada, eu consegui colocar o conteúdo tanto do menú, quanto do centro da página no topo sem desalinhar um ao outro como você me disse.
Agora eu queria saber só mais uma coisinha... Como eu ajusto o rodapé pra ocupar a mesma largura do menu e o centro juntos? Sem passar o limite da página como está aqui:
http://n-coisasdemim.blogspot.com/
Agora eu queria saber só mais uma coisinha... Como eu ajusto o rodapé pra ocupar a mesma largura do menu e o centro juntos? Sem passar o limite da página como está aqui:
http://n-coisasdemim.blogspot.com/
#4
Guilherme Vieira
-
- Usuários
-
- 113 posts
Normal
- Sexo:Masculino
- Localidade:Fortaleza, Ceará
- Interesses:Desenvolvimento Web baseado nos padrões do W3C, HTML5, CSS3, PHP, JavaScript, jQuery, AJAX, SQL, MySQL.
Posted 07/10/2010, 23:43
muda a propriedade width para 942 semaporcentagem
Mas ainda terecomendo naopusar layout em tabelas ^^
qlqr d´puvido, à disposição!
Mas ainda terecomendo naopusar layout em tabelas ^^
qlqr d´puvido, à disposição!
- :. WebGirL .: likes this
#5
:. WebGirL .:
-
- Usuários
-
- 48 posts
Turista
- Sexo:Não informado
Posted 10/10/2010, 19:02
Consegui! ^^
Agora queria que o texto de onde leva o conteúdo ficasse alguns pixels mais para a esquerda, que acho que está muito afastado da margem. E no menú, que o lado da margem direita ficasse mais para o lado esquerdo, que está quase saindo para o lado de onde se coloca o conteúdo.
Estou em dúvidas entre padding e margin para serem usados nesse caso.
n-coisasdemim.blogspot.com
Agora queria que o texto de onde leva o conteúdo ficasse alguns pixels mais para a esquerda, que acho que está muito afastado da margem. E no menú, que o lado da margem direita ficasse mais para o lado esquerdo, que está quase saindo para o lado de onde se coloca o conteúdo.
Estou em dúvidas entre padding e margin para serem usados nesse caso.
n-coisasdemim.blogspot.com
#6
Guilherme Vieira
-
- Usuários
-
- 113 posts
Normal
- Sexo:Masculino
- Localidade:Fortaleza, Ceará
- Interesses:Desenvolvimento Web baseado nos padrões do W3C, HTML5, CSS3, PHP, JavaScript, jQuery, AJAX, SQL, MySQL.
Posted 10/10/2010, 21:14
Sua div que fica embaixo do comentario "aqui começam todos os posts"
E coloque suas tags <style> dentro de <head></head>, pois assim o estilo é carregado antes do conteudo.
<!-- começa todos os posts-->
<div align="right">
Está comlargura maiordo que deveria. Fixe seu tamanhemem 260 (que éo tamanho que deveria ter, se nos basearmos nas porcentagens que vc definiu.)E coloque suas tags <style> dentro de <head></head>, pois assim o estilo é carregado antes do conteudo.
Edição feita por: Guilherme Vieira, 10/10/2010, 21:15.
#7
:. WebGirL .:
-
- Usuários
-
- 48 posts
Turista
- Sexo:Não informado
Posted 11/10/2010, 23:57
Sua div que fica embaixo do comentario "aqui começam todos os posts"
<!-- começa todos os posts--> <div align="right">Está comlargura maiordo que deveria. Fixe seu tamanhemem 260 (que éo tamanho que deveria ter, se nos basearmos nas porcentagens que vc definiu.)
E coloque suas tags <style> dentro de <head></head>, pois assim o estilo é carregado antes do conteudo.
Eu coloquei as tags <style> entre <head> e </head> já.
Agora o tamanho da div em "começam todos os posts" essa parte é o que define o tamanho do menú acima que tem um scroll de rolagem, a parte que tem o nome "Novas!" no layout. Aparentemente a estética da largura dele aparece bem.. (??!!)
2 user(s) are reading this topic
0 membro(s), 2 visitante(s) e 0 membros anônimo(s)
