RodrigoGomes Postado Dezembro 4, 2007 Denunciar Share Postado Dezembro 4, 2007 boa noite pessoal..eu estou um tanto confuso com estes divs e css.. :huh: eu tenho um div e quero que ele se expanda conforme o navegador, usando o 100%..certo.. mas o problema é que o 100% não funciona!#CTR1 { clear:both; text-align:left; background:url(../color_fix/barracent.png) repeat-x left top; width:100%; min-height:600px; min-width:629px;}<div id="CTR1">oi oi<br />teste</div>obs.: o site será valido pelo w3c Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 KaKarotto Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 Ué velho....ele está a 100%.Não há nada de difícil no Css, pra falar a verdade, somos nós quem complicamos.Talvez você esteja usando uma imagem de fundo que não acompanha todo o div, dando a impressão de que o div não está a 100%. Bota uma borda nele pra você ver que ele está a 100%.Kelabrasssssss Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 tenta só assim pra ver...#CTR1 { width:100%; min-width:629px; } Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) só uma dica min-width e min-height não funcionam no IEe outra coisa quando você usa "background:;" você deve aplicar uma cor ou transparenciatipo assim:background: #fff url(../color_fix/barracent.png) repeat-x left top; ou assim: background: transparent url(../color_fix/barracent.png) repeat-x left top; se não pode ocorrer erro de validação e também não se esqueça você deve definir a altura HEIGHT:;(use 100% ou auto ou tamanho em pixel) faça assim só pra testar: #CTR1 { clear:both; text-align:left; background: #fc0 url(../color_fix/barracent.png) repeat-x left top; width:100%; min-height:600px; min-width:629px; } Editado Dezembro 5, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 só uma dica min-width e min-height não funcionam no IEfuncionam sim... Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) no IE6 não funciona se eu não me engano só no IE7cassiano você deve ter é o IE7 ae pois pode verificar na NETo MIN-WIDTH,MAX-WIDTH,MIN-HEIGHT e MAX-HEIGHT para IE6 não funcionamnão se prenda só ao IE7 ou Firefox lembre-se se você quiser fazer algo com semânticalembre-se que há mais navegadores a se utilizarNETSCAPSAFARIOPERAETC Editado Dezembro 5, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) no IE6 não funciona se eu não me engano só no IE7cassiano você deve ter é o IE7 ae pois pode verificar na NETo MIN-WIDTH,MAX-WIDTH,MIN-HEIGHT e MAX-HEIGHT para IE6 não funcionamnão se prenda só ao IE7 ou Firefox lembre-se se você quiser fazer algo com semânticalembre-se que há mais navegadores a se utilizarNETSCAPSAFARIOPERAETCfunciona sim...Eu nem uso IE pra navegar, só tenho instalado aqui porque muitos usuários iludidos usam ele hahhaa daqui a pouco posto um exemplo, é que to saindo agora.... Editado Dezembro 5, 2007 por cassianooliver Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) no INTERNET EXPORER 6 eu garanto que não funciona você deve pensar que tah funcionandodeve ser impressão suaé eu também não sou usuario do IEmas você tem de levar em consideração que a validação não inclui só "o melhor navegador"(seja ele qual for)e sim uma semânticavocê tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3C Editado Dezembro 5, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 hipnos,você é igual a mim...é teimoso hahahahavocê tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3Ctodos os meus sites são assim, mesma visualização em todos os navegadores e sigo também os padrões...mas funciona sim viu...um EX:#div { width: 520px; min-height: 690px; height: auto !important; // Aqui faz com que funcione no IE 6 height: 690px; padding: 10px; float: left; }uso isso em vários sites, e funciona tanto no IE6, IE7 e FF. Nos outros não sei pois nunca utilizei.. Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) Vixe você viajou grandão(sem maldade) mas assim é logico que vai funcionar porque é um HACK(hack é uma ideia de "gambiarra" que ro dizer não é necessariamente um HACK mas sendo algo que faz funcionar em devido navegador já é burlar um "defeito" por isso considero ele assim pois o "important" assim =])o MIN e MAX não funcionam é que o DIV no IE aumenta sozinhosabia que você tava se enganandoprocure estudar sobre os HACKsisso que você fez é umisso não faz funcionar no IE faz é funcionar no FFheight: auto !important;pro FF você ter um objeto(DIV) que aumente sozinho você deve usar height:auto;já objetos tipo DIV aumentam sozinho no IE vai pela minha ideianão é teimosia minha é real você tah se confundindotesta isso:<style> #ff { background:#fc0; width: 20px; min-height: 10px; height: auto; } #IE{ background:#fc0; width: 20px; height: 10px; float: left; } </style> <div id="ff">conteudo</div> <br> <div id="ie">conteudo</div>explicação:No IE divs(ou elementos complacentes) aumentam conforme o texto ou conteudo sem necessidadede definir altura automatica HEIGHT:AUTO;no FF você deve definir o objeto com HEIGHT:AUTO; pois se não possuir isso o DIV no FFnão acompanha o conteudo Editado Dezembro 8, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 discordo, hack seria se eu usasse isso..* html .div { ...atributos } ou html>body .div { ...atributos }!important é uma regra que foi especificada pelo próprio W3C...height: auto !important;mas eu não disse que isso aí faz a div aumentar automaticamente..isso aí foi colocado para que junto com o min-height, o Ie6 a faça aumentar automaticamente...sabia que você tava se enganandoprocure estudar sobre os HACKsnesse caso num estou não... :P Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 (editado) mas o IE não interpreta o IMPORTANT só navegadores como Opera,ff, netscap e complacentesHACK é uma maneira interpretativa de fazer uma "gambiarra"isso que você fez foi burlar o comando height:auto para ele ser só lido no FFainda sim mesmo que eu tenha falado que tal coisa é um hack sem ser(kkkk)o MIN-HEIGHT e MAX-HEIGHT não funcionam no IEé assim o HEIGHT:AUTO;+MIN-HEIGHT:10px; fazem o DIV ter uma altura minima e aumentar conforme conteudono FF (e complacentes)o HEIGHT:10px; basta para o IE por que ele redimensiona o DIV sem necessidade do HEIGHT:AUTO;sem maldade cara é que você tah fazendo a aplicação direitinho só que você não ta entendendo como elafuncionaabraço Editado Dezembro 5, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 5, 2007 Denunciar Share Postado Dezembro 5, 2007 mas o IE não interpreta o IMPORTANTopa, realmente, nessa parte me enganei...mas pra mim o !important não é um hack...mas já chega disso hahahatenho 2 sites ainda pra terminar...vlw! Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 KaKarotto Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 É engraçado que a gente posta ajudando e os [caras] não retornam pra gente saber se a dica funcionou ou não né....Não me refiro a esse, talvez o cara ainda não tenha tido tempo pra postar, mas é triste...to vendo varios outros posts meu indo pro espaço...to curioso pra saber se funcionou e tal e os [caras] somem.Então, pra acabar com a briga. Cassiano, eu já te elogiei e sabe que eu respeito você muito em matéria de design, mas em Css você peca, falta chão ainda, falo isso com todo o respeito, Css é fácil realmente, mas dependendo do contexto.min-height e min-width, não funcionam no ie6, e fim de papo.Outra coisa, hipnos:é eu também não sou usuario do IEmas você tem de levar em consideração que a validação não inclui só "o melhor navegador"(seja ele qual for)e sim uma semânticavocê tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3CIsso não existe né... A validação não inclui NENHUM navegador, são os navegadores que devem seguir os padrões. A validação só serve para você saber que aqueles códigos estão corretos segundo as normas da W3C, isso não tem nada a ver com semântica. O que disse não faz sentido, você pode construir um site validado e que não tenha nenhuma semantica ou pode construir um site validado que não funciona em todos os browsers. A validação é uma coisa, a semântica é outra e ACESSIBILIDADE é outro assunto.você pode usar o min-height e min-width em toda a sua página, isso fará com que seu site siga os padrões, porém não vai ser exibido corretamente no ie6, aí não é questão de semantica ou validação e sim de acessibilidade. Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 cassianooliver Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 Então, pra acabar com a briga. Cassiano, eu já te elogiei e sabe que eu respeito você muito em matéria de design, mas em Css você peca, falta chão ainda, falo isso com todo o respeito, Css é fácil realmente, mas dependendo do contexto.meu CSS é muito melhor em prática do em teoria hahahaconfesso..bom, não é desculpa mas comecei a trabalhar com WS há menos de 6 meses...css, xhtml, tableless, semantica, validação, padrões, isso pode, isso não pode...aff, é muita coisa hahahamas é isso aí...com o tempo agente aprende...Isso não existe né... A validação não inclui NENHUM navegador, são os navegadores que devem seguir os padrões. A validação só serve para você saber que aqueles códigos estão corretos segundo as normas da W3C, isso não tem nada a ver com semântica.falou tudo... Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 KaKarotto Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 rsrsrs perdão a falta de educação Moderador....Eu me matei de rir quando eu vi que o post foi editado, mas não por isso, ri pelo substantivo usado na troca kkkkkk. Pra mim teve graça porque eu sei o que eu tinha digitado antes rsrsrsrsrs.Vou tentar ser mais educado. Malz ae. Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 (editado) meu CSS é muito melhor em prática do em teoria hahahaconfesso..bom, não é desculpa mas comecei a trabalhar com WS há menos de 6 meses...css, xhtml, tableless, semantica, validação, padrões, isso pode, isso não pode...aff, é muita coisa hahahamas é isso aí...com o tempo agente aprende...ninguém é tão bom que não tenha errado e outra você deveria ter pesquisado antes de começar a insitir nissofalei que você tava confundindo(não que eu também não tenha me confundio hehe, nisso também parecemos)---------------------kakarotto o W3C foi criado para ajudar o usuario a fazer o site o mais correto possivel(em termo de lógica, não que seja certo essa ideia pois qualquer um sabe que os padrões podem mudar brusacamente daqui uns anos)acho que o cassiano foi muito precipatado ao falar de min- e max-mas você está sendo mais precipitado aindaessa ajuda não é pra montar sites sem semantica e tem sim haver com "navegadores"pois seguindo essas normas seu site ficará com o código mais "correto" lógico que ainda dependemos de gambiarras (as vezes enormes) para conseguir determinado efeitosinto muito se você confundio as coisas mas é obivio que me enganei em algumas coisasmas o tópico aqui é pra ajudar na duvida de alguém e eu só apontei os "erros" que fariam ele ter problemasmais adiantemas o cassiano insitiou que eu estava errado e na hora da preça escrevi sem me explicar muito bemmalz qualquer coisamas você é muito exagerado kakarotto----------------------------------------agora esquecendo isso vamos ao que interessa...Vampyro aqui o seu Css funcionou normalte pergunto então você esta usando "STRICT"?é uma dessas? :HMTL:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> XHTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> se estiver uma dessas duas(tanto faz), faça isso no CSS <style> html, body{ margin:0px; padding:0px; width:100%; height:100%; } </style>tenho quase certeza de que irá funcionar Editado Dezembro 6, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 RodrigoGomes Postado Dezembro 6, 2007 Autor Denunciar Share Postado Dezembro 6, 2007 opas KaKarotto, desculpe não ter avisado se deu ou não certo.. xDé que eu tive que resolverde outra forma.. o meu problema não tem solução.. até onde sei de css.. e html..era que eu tinha três divs uma na frente da outra, todas com float:left e a do meio eu queria em 100%, isso é impossivel! a ultima div sempre iria se separar da base..então tive que esquecer isso de porcentagem e fazer tudo de um só tamanho.. e pegar a o tamanho do monitor do user com php para fazer isso ficar correto.. mas vlw mesmo pela força ai!sempre tou aqui se precisar.. ;) Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 (editado) Engano seu tem solução sim...eu tenho a solução pra você Vampyro<style> #div1{ background:#fc0; float:left; width:99px; height:500px; } #div2{ background:#fc0; float:right; width:99px; height:500px; } #div3{ background:#fc0; display:block; margin: 0px 100px; height:500px; } </style> <div id="div1">esq</div> <div id="div2">dir</div> <div id="div3">conteudo</div> Editado Dezembro 8, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 RodrigoGomes Postado Dezembro 6, 2007 Autor Denunciar Share Postado Dezembro 6, 2007 hipnos né que funcionou!vlw amigo! :lol: Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 hipnos na area Postado Dezembro 6, 2007 Denunciar Share Postado Dezembro 6, 2007 (editado) tópico resolvidohipnos né que funcionou!vlw amigo!Que isso =] desculpa pela discução no teu tópico é que quando tenho certeza de algo vou atéonde posso ^^ainda bem que sua dúvida foi resolvidafalow Editado Dezembro 6, 2007 por hipnos na area Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
RodrigoGomes
boa noite pessoal..
eu estou um tanto confuso com estes divs e css.. :huh:
eu tenho um div e quero que ele se expanda conforme o navegador, usando o 100%..
certo.. mas o problema é que o 100% não funciona!
#CTR1 {
clear:both;
text-align:left;
background:url(../color_fix/barracent.png) repeat-x left top;
width:100%;
min-height:600px;
min-width:629px;
}
<div id="CTR1">
oi oi<br />teste
</div>
obs.: o site será valido pelo w3c
Link para o comentário
Compartilhar em outros sites
20 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.