trabalhando com css para se parecer com tabelas

[RoXbY 3]

Fala gaera, beleza? meu primero post aqui nesta seção... ehehhe.. minha dúvida é a seguinte:

 

Estou refazendo um projeto em tableless, tentando retirar o máximo de tabelas que eu puder para dar uma otimizada. Estoou com um probleminha na parte do conteúdo....

Meu projeto é dividido em 4 divs principais..

 

#topo

#menu

#conteudo

#label

 

o problema é a #conteudo

 

Partindo desde o início incontrei uma certa dificuldade em definir "margin: 1% 1% 1% 1%;", mas vai lá.. ficou parecido com o que eu queria, apesar de IE e FF apresentarem diferenças ainda está atendendo com minhas necessidades.

 

#conteudo{

margin: 1% 1% 1% 1%;

border-width: thin;

border-style: solid;

border-color: #999999;

background-color:#FFFFFF;

}

 

Dentro da div conteúdo tenho que aplicar duas div's diferentes, que são elas:

#esquerda

#direita

 

#esquerda{

float:left;

left:160px;

}

 

#direita{

float:right;

}

 

a esquerda será outro menuzinho onde chamarei um "include" e a #direita também chamará uma "include" porém será o conteúdo. Meu problema é:

 

*No IE aparece do jeito certo, a div com fundo, com bordas e tudo mais, porém no FF não! como posso resolver isso?

*O left da esquerda também não aplica :(

 

brigado desde já... abração :D

[Andre Cocuroci 0]

Pelo o que entendi a solução deste seu problema esta neste tópico:

 

http://forum.imasters.com.br/index.php?sho...27entry539327

 

De uma lidinha nele.

[micox 2]

Links com o problema online ajudam agente a te ajudar melhor...

[RoXbY 3]

cara, muito obrigado! desculpe mas não sabia com que nome procurar, sou iniciante em tableless, e desculpe mas não posso postar o link, é um software que estou desenvolvendo..qualquer problema posto aqi novamentebrigadão!

[pa_bruno 0]

jah vi q naum leu meu artigo d reciclagem de css neh?

isso:

#conteudo{margin: 1% 1% 1% 1%;border-width: thin;border-style: solid;border-color: #999999;background-color:#FFFFFF;}

pode virar isso:

#conteudo{margin: 1%;border: thin solid #999;background-color:#FFF;}

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[RoXbY 3]

ahahahhaa..não li não cara, mas tou lendo tou buscando e logo serei mais desenvolvedor em css.. um tempo atrás até comessei a desenvolver em tableless, mas arrumei um freela e precisei voltar pras tabelas, pois não tinha conhecimento suficiente e tempo pra aprender. Agora, estou desenvolvendo e quero aprender e VOU! :Dabração... toda ajuda é bem vinda;)

[Hunter_ 0]

#conteudo{margin: 1% 1% 1% 1%;border-width: thin;border-style: solid;border-color: #999999;background-color:#FFFFFF;}

ao que eu sei o firefox não renderiza objetos sem altura, faça o q o pa falou e ponha assim:

#conteudo{margin: 1%;border: thin solid #999;background-color:#FFF;height: 5px; /*exemplo*/}

http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

[pa_bruno 0]

ao que eu sei o firefox não renderiza objetos sem altura, faça o q o pa falou e ponha assim:http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

depende rapaz... se ele tiver conteúdo, sim... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Hunter_ 0]

é verdade, heeheh esqueci de complementar, mas ele setando uma altura apenas para estruturar o layout (fase de desenvolvimento) fica melhor para ele depurar os erros q vem surgindo

[RoXbY 3]

</div>

<div id="conteudo">

<div id="esquerda">

<? include("account_menu.php"); ?>

</div>

<div id="direita">

<div id="main">

<div id="main_top">

<div id="main_top_direita">

main_top_direita

</div>

<div id="main_top_esquerda">

main_to_esquerda

</div>

<div id="main_top_conteudo">

conteudo

</div>

</div>

</div>

</div>

</div>

 

 

isso existe?

 

queria fazer como se utilizasse tabelas... por exemplo.. uma tabela principal com 98% do layout, com duas colunas.. a coluna da esquerda com 160px e a da direita livre, dentro desta livre, outra tabela... duas linhas, a linha de cima com duas colunas, e a linha de baixo livre pro conteudo :)

 

sacou?

[micox 2]

A div mania ataca novamente. hhehe

 

Seguinte Roxby: NÃO use divs indiscriminadamente!, apesar deste ser um dos passos comuns de quem está abandonando as tabelas agora.

Parabéns pela iniciativa.

Agora voce deve passar para o próximo passo que é usar as tags corretas apenas onde elas são necessárias.

Leia este tutorial do maujor: http://www.maujor.com/tutorial/divmania.php

 

Não sei se tem a ver com sua dúvida, mas irá te ajudar bastante.

[RoXbY 3]

huhuhu... vou ler.. abraçã :D:D:D

[TheChessMan 0]

Cuidadooooooooo !Este tópico está sob quarentena sob suspeita de estar infectado com a doença mortal DIVITE!CAUTION! NO-Semantic pages DANGER!

[RoXbY 3]

queque eh divite? iaiuhaiuah

[TheChessMan 0]

É uma doença mortal que pode causar páginas não semânticas!Cuidadooo!!!

[pa_bruno 0]

É uma doença mortal que pode causar páginas não semânticas!Cuidadooo!!!

mas eh bobo pra kct... uahuahuhauhuauahuauhua... mto bom, mto bom...divite nada mais eh q você TROCAR os tables, trs e tds por divs... o q naum eh semantico... ;)

[RoXbY 3]

Opa galera, acho que ta melhorando a historia.. ehehehe... mããx... alguém poderia me dar uma luz no que estou errando? :) eu quero o conteudo e o menu um do lado do outro igual ao IE, se você abrir no FF verá o problema ...

 

Link do site

 

ps.: o menu ali no lado é um include, não liguem pras tabelas X)

[pa_bruno 0]

estude mais rapaz... o float right q você colocou no conteúdo, naum quer dizer q ele vah pra direita d acordo com o da esquerda... leia meu artigo q fala sobre isso... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif tah pendurado ali em cima...

 

eh soh colocar um margin-left q resolve

#conteudo_direita{margin-left: 165px;}

falow

[RoXbY 3]

Fala galera, pra não abrir otro topico.. ehehhe

 

olhe no link...

 

estou com akele quadradinho vermelho no canto direito, certo? precisava que ele ficasse em ocupando todo akele espaço sem nada, ao contrario de um pequeno espaço ali no cantinho.. ele é definido o tamanho atravez do conteudo, não tem como definir um tamanho em 100% por exemplo? por que quero que incaixe em todas as resoluções mas em relação a altura tem que ficar móvel..

 

otra coisa é:

como eu centralizo aquela parte do meio no IE

como que eu fasso pra deixar a barra cinza clara ali embaixo no IE com um tamanho menor de altura.

 

abração!