CSS

ONBASS 23/08/2012 09:05:31
#408408
Srs. Bom dia! Como passaram de ontem? Espero em Deus que todos bem... ok.

Como é de se esperar para todo noob estou aqui de novo, que para muitos pode ser bobeira, vamos lá:

O X da questão é: Quero colocar uma imagem dentro da DIV SITE, de forma que ela se encaixe perfeitamente
dentro dela, digo, que nao ultrapasse os limites, ainda que a DIV SITE possua cantos arredondados(RADIUS),
tentei fazer isso mas a imagem saltou para fora da div com a opção RADIUS, onde fica a [ô]dobrinha[ô];

Depois tentei colocar um z-index na imagem, claro com valor menor que todos, mesmo assim a danadinha
ficou por cima de tudo; a solução que no momento mais acalhou foi pelo Background, porem no resize do
navegador a imagem fica meio que desfocando, porque o browser tenta re-renderizar ae nao gostei muito
do resultado;

Em suma, quero colocar uma imagem dentro da DIV SITE, que fique por baixo das demais e nao ultrapasse os
limites da Div;

Outro ponto é que nao consequi aplicar o Overflow na DIV SITE, tipo no documento está como Overflow:Hidden, e na DIV SITE está como Auto, porém nao funciona, tentei outras opções sem sucesso, a unica que aceitou foi Scroll, porem fica desabilitada, mesmo com Overflow true;

Estou usando a versao 2012 do Visual Studio.
Grato a todos.
KERPLUNK 23/08/2012 09:47:41
#408413
Resposta escolhida
Cantos arredondados são um verdadeiro tormento. Para browsers porcaria(em outras palavras Internet Explorer), na maioria dos casos as coisas acontecem bem diferente de como deveriam e tem que ficar fazendo gambiarra para poder funcionar. Outro detalhe importante, é evitar ao máximo o uso de posicionamento absoluto, isso também faz os conteúdos [Ô]saírem do lugar[Ô]
ONBASS 23/08/2012 09:49:58
#408415
Eu achava justamento o contrário, que o relativo é que desorganizava.
KERPLUNK 23/08/2012 10:18:46
#408417
Procure sempre trabalhar com posicionamento relativo. Eles são mais [Ô]fluídos[Ô], se ajustando a qualquer resolução de monitor.
ONBASS 23/08/2012 10:23:02
#408418
Mas percebo que às vezes eles [Ô]cedem[Ô] muito fácil à qualquer elemento proximo, desorganizando assim o layout.
KERPLUNK 23/08/2012 10:24:59
#408420
Por isso que você tem que [Ô]manjar[Ô] muito bem sobre eles, uma vez ajustados corretamente, fica tudo muito mais simples. O truque é se usar masterpages, os placeholders de conteúdo dela devem estar dentro das divs de layout e não o contrário. Dessa maneira tudo vai estar sempre ajustado.
ONBASS 23/08/2012 11:22:49
#408431
Exato, já uso assim.

Tipo assim:

Citação:


<body>
<form>
<div class=[Ô]Site[Ô]>
<div class=[Ô]Topo[Ô]>

</div>

<div class=[Ô]Mensagem[Ô]>

</div>

<div class=[Ô]MenuEsquerda[Ô]>

</div>

<div class=[Ô]Conteudo[Ô]>
<ContentPlaceHolder ..>

</ContentPlaceHolder>
</div>

<div class=[Ô]Rodape[Ô]>

</div>

</div>
</form>
</body>



Dae quero deixar o Body com um background tipo [ô]Padrao[ô], e na Div Site colocar uma imagem de fundo, sem que ela interfira no comportamento das demais div[ô]s.
ONBASS 24/08/2012 08:43:47
#408517
Rpz to apanhando feio no design e css, mas a gente chega lá.
KERPLUNK 24/08/2012 09:05:11
#408521
Para colocar uma imagem de [Ô]fundo[Ô] em uma div, no estilo dela use:
background:url(../imagens/minha_imagem.jpg) bottom no-repeat;
ONBASS 24/08/2012 09:11:59
#408524
to ligado KERP,

a questao é quando tenho que arranjar as boxes onde os conteiners de baixo levam alguma foto como background.

ps. voltei pro 2010, o 2012 , nao sei se porque nao acertei, nao ta dando overflow nas boxes.
KERPLUNK 24/08/2012 09:13:31
#408526
Mas relaxa, essa parte de ajustar lay-out é mesmo MUITO ruim e nem sempre é lógico...
Tópico encerrado , respostas não são mais permitidas