Jump to content
Fórum Script Brasil
  • 0

(Resolvido) width em div não funciona


RodrigoGomes

Question

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 to comment
Share on other sites

20 answers to this question

Recommended Posts

  • 0

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

Link to comment
Share on other sites

  • 0

só uma dica min-width e min-height não funcionam no IE

e outra coisa quando você usa "background:;" você deve aplicar uma cor ou transparencia

tipo 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;
}

Edited by hipnos na area
Link to comment
Share on other sites

  • 0

no IE6 não funciona se eu não me engano só no IE7

cassiano você deve ter é o IE7 ae pois pode verificar na NET

o MIN-WIDTH,MAX-WIDTH,MIN-HEIGHT e MAX-HEIGHT para IE6 não funcionam

não se prenda só ao IE7 ou Firefox lembre-se se você quiser fazer algo com semântica

lembre-se que há mais navegadores a se utilizar

NETSCAP

SAFARI

OPERA

ETC

Edited by hipnos na area
Link to comment
Share on other sites

  • 0
no IE6 não funciona se eu não me engano só no IE7

cassiano você deve ter é o IE7 ae pois pode verificar na NET

o MIN-WIDTH,MAX-WIDTH,MIN-HEIGHT e MAX-HEIGHT para IE6 não funcionam

não se prenda só ao IE7 ou Firefox lembre-se se você quiser fazer algo com semântica

lembre-se que há mais navegadores a se utilizar

NETSCAP

SAFARI

OPERA

ETC

funciona 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....

Edited by cassianooliver
Link to comment
Share on other sites

  • 0

no INTERNET EXPORER 6 eu garanto que não funciona você deve pensar que tah funcionando

deve ser impressão sua

é eu também não sou usuario do IE

mas 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ântica

você tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3C

Edited by hipnos na area
Link to comment
Share on other sites

  • 0

hipnos,

você é igual a mim...

é teimoso hahahaha

você tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3C

todos 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..

Link to comment
Share on other sites

  • 0

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 sozinho

sabia que você tava se enganando

procure estudar sobre os HACKs

isso que você fez é um

isso não faz funcionar no IE faz é funcionar no FF

height: 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 ideia

não é teimosia minha é real você tah se confundindo

testa 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 necessidade

de definir altura automatica HEIGHT:AUTO;

no FF você deve definir o objeto com HEIGHT:AUTO; pois se não possuir isso o DIV no FF

não acompanha o conteudo

Edited by hipnos na area
Link to comment
Share on other sites

  • 0

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 enganando

procure estudar sobre os HACKs

nesse caso num estou não...

:P

Link to comment
Share on other sites

  • 0

mas o IE não interpreta o IMPORTANT só navegadores como Opera,ff, netscap e complacentes

HACK é uma maneira interpretativa de fazer uma "gambiarra"

isso que você fez foi burlar o comando height:auto para ele ser só lido no FF

ainda 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 conteudo

no 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 ela

funciona

abraço

Edited by hipnos na area
Link to comment
Share on other sites

  • 0

É 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 IE

mas 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ântica

você tem de fazer algo que funcione igual para todos é pra isso que foi criado os padrões W3C

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.

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.

Link to comment
Share on other sites

  • 0
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 hahaha

confesso..

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 hahaha

mas é 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...

Link to comment
Share on other sites

  • 0

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.

Link to comment
Share on other sites

  • 0
meu CSS é muito melhor em prática do em teoria hahaha

confesso..

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 hahaha

mas é 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 nisso

falei 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 ainda

essa 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 efeito

sinto muito se você confundio as coisas mas é obivio que me enganei em algumas coisas

mas o tópico aqui é pra ajudar na duvida de alguém e eu só apontei os "erros" que fariam ele ter problemas

mais adiante

mas o cassiano insitiou que eu estava errado e na hora da preça escrevi sem me explicar muito bem

malz qualquer coisa

mas você é muito exagerado kakarotto

----------------------------------------

agora esquecendo isso vamos ao que interessa...

Vampyro aqui o seu Css funcionou normal

te 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

Edited by hipnos na area
Link to comment
Share on other sites

  • 0

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.. ;)

Link to comment
Share on other sites

  • 0

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>

Edited by hipnos na area
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



  • Forum Statistics

    • Total Topics
      152k
    • Total Posts
      651.6k
×
×
  • Create New...