Espaço inexistente

[David Terra 0]

CODE

* {
margin:0;
padding:0;
}
body {
margin:0;
padding:0;
text-align:center;
}

#wrapper {
width: 768px;
margin:0 auto;
padding: 0px;
text-align:left;
}
#header {
width: 768px;
height: 143px;
background-image: url('../img/bg_r1_c1.jpg');
background-repeat: no-repeat;
background-attachment: scroll;
background-x-position: left;
background-y-position: top;
}

#body-page {
width: 768px;
height: 719px;
background-image: url('../img/bg_r2_c1.jpg');
background-repeat: no-repeat;
background-attachment: scroll;
background-x-position: left;
background-y-position: top;
}

DIV.logo {
position: relative;
top: 50px;
left: 0px;
margin-left:60px;
margin-top:0px;
WIDTH: 180px;
HEIGHT: 59px;
background-color: #66FF00;
}
DIV.body-girl {
position: relative;
top: -60px;
right: -245px;
margin-right: 0px;
margin-top:0px;
WIDTH: 232px;
HEIGHT: 430px;
}
DIV.subcol{
position: relative;
top: -430px;
right: -490px;
margin-right: 0px;
margin-top:0px;
width: 160px;
height: 355px;
}
DIV.bannerbox {
position: relative;
top: -540px;
right: -580px;
margin-right: 0px;
margin-top:0px;
width: 140px;
}
DIV.bannerButton {
position: relative;
top: 0px;
left: 0px;
margin-left: 30px;
margin-right: 30px;
margin-top: -420px;
height: 200px;
}

Div.bannerR{
Float: left;
Width: 49%
}

Div.bannerL{
Float: right;
Width: 49%
}

CODE

<DIV ID="wrapper">

<DIV ID="header">


<DIV class="banner">

</DIV>
</DIV>

<DIV ID="body-page">

<DIV CLASS="logo">

</DIV>

<DIV class="body-girl">

</DIV>

<DIV class="subcol">

</DIV>
<DIV class="bannerButton">
<Div Class="bannerL">

</Div>
<Div Class="bannerR">

</Div>
</DIV>
</DIV>
<CENTER>
<ADDRESS>
Melhor visualizado em 800x600 Copyright © Todos direitos reservados
</ADDRESS>
</CENTER>
</DIV>

[Giovani 104]

Você não tem um link ai?

[David Terra 0]

Você não tem um link ai?

site

[David Terra 0]

Por favor, alguém pode me dar uma dica de como resolver isso já refiz varias vezes o código e não consigo entender pq fica esse espaço.

 

Desde já obrigado.

[brcontainer 16]

acredito que o problema seja por causa das TAGs <script> no final

;)

[Paulo de Tarso F. M. 24]

Cara, seu código está horrível!

 

Percebi que está utilizando imagens como parte da estrutura de sua página, e isso é errado. Dá para perceber que usou o recurso de fatiamento de imagens de um software gráfico, como o Fireworks e o Photoshop.

 

Outra coisa, por exemplo, a garota: ela não faz parte do conteúdo da página, né? Ela apenas compõe o aspecto visual da página, e não se relaciona com mais nenhum outro elemento ao seu redor. Oras, se ela faz parte apenas do aspecto visual, isso deve ser feito então somente através do CSS, e não através da tag <img>.

 

Veja bem, quais os casos em que usamos a tag <img> então? Por exemplo, em uma página de notícias que mostra a foto de um alagamento. Esta foto faz parte do conteúdo, pois se relaciona o texto da matéria, que fala sobre um alagamento. Por isso, ela é inserida com a tag <img>, e não como uma imagem de fundo (background-image)em uma div.

 

Compreende?

 

Bom, minha dica é: se preocupe mais com o código. Do jeito que está, fica muito complicado se encontrar um erro, tem muita coisa desnecessária.

[David Terra 0]

Cara, seu código está horrível!

 

Percebi que está utilizando imagens como parte da estrutura de sua página, e isso é errado. Dá para perceber que usou o recurso de fatiamento de imagens de um software gráfico, como o Fireworks e o Photoshop.

 

Outra coisa, por exemplo, a garota: ela não faz parte do conteúdo da página, né? Ela apenas compõe o aspecto visual da página, e não se relaciona com mais nenhum outro elemento ao seu redor. Oras, se ela faz parte apenas do aspecto visual, isso deve ser feito então somente através do CSS, e não através da tag <img>.

 

Veja bem, quais os casos em que usamos a tag <img> então? Por exemplo, em uma página de notícias que mostra a foto de um alagamento. Esta foto faz parte do conteúdo, pois se relaciona o texto da matéria, que fala sobre um alagamento. Por isso, ela é inserida com a tag <img>, e não como uma imagem de fundo (background-image)em uma div.

 

Compreende?

 

Bom, minha dica é: se preocupe mais com o código. Do jeito que está, fica muito complicado se encontrar um erro, tem muita coisa desnecessária.

Paulo obrigado pelas dicas estão sendo muito uteis, como devo proceder com a imagem de fundo? Já que abrange toda página.

 

Obrigado

[brcontainer 16]

bem se abrange mesmo toda a página aplique no seletor body

 

body{
background-image:url(fundo.jpg);
}

se usar apenas um elemento(DIV ou complacente) simplismente aplique assim nessa ideia:

 

.seletorA{
width:500px;/*modifique aqui*/
height:200px;/*modifique aqui*/
background-image:url(fundo.jpg);
}

acaso abranger mais de um elemento você pode usar z-index:;

ou faça assim:

#seletorA{
float:left;
width:200px;
height:50px;
}
#seletorB{
float:right;
width:200px;
height:50px;
}
#fundo {
background-image:url(fundo.jpg);
width:400px;
height:50px;
}

HTML:

<div id="fundo">
<div id="seletorA">A</div>
<div id="seletorB">B</div>
</div>

falow ;)

[David Terra 0]

Qual a maneira correta de posicionar a imagens dentro site?

 

Sempre devo usar esses código para manipular a posição?

 

CODE

top: 0px;

left: 0px;

margin-left: 0px;

margin-right: 0px;

margin-top: 0px;

[brcontainer 16]

imagem ou BACKGROUND

caso seja background:; faça a maneira que lhe mostrei no POST anterior

porem você pode usar position:absolute; top:; left:; right:; bottom:; e z-denx:;

mas acredito que irá dar muito mais trabalho

 

você tambem pode posicionar a imagem de fundo pelo BACKGROUND:;

 

assim:

 

background: #fff url('img.gif') 50px 50px no-repeat;

ou assim

background: #fff url('img.gif') center no-repeat;
background: #fff url('img.gif') left no-repeat;
background: #fff url('img.gif') right no-repeat;

no lugar de no-repeat você pode usar repeat-x ou repeat-y

 

abraço ;)

[David Terra 0]

Seria uma imagem mesmo, tipo a "mulher"que tenho no centro da página. Qual seria a maneira correta de posiciona-la?

 

Obrigado!

[brcontainer 16]

bem ae você poderia usar no BODY

body{
background: #fff url(mulher.jpg) center no-repeat;
}

falow ;)

[David Terra 0]

Creio não estar fazendo a pergunta certo ou não sabendo me expressar, vamos ver se consigo chegar no meu objetivo.

 

Atualmente meu CSS está da seguinte forma.

 

* {
margin:0;
padding:0;
}

html{
background:url('../img/bg-body.gif') repeat fixed 0 0;
}

body {
margin:0;
padding:0;
text-align:center;
}

#wrapper {
width: 768px;
height: 862px;
margin:0 auto;			
padding: 0px;
text-align:left;
background-image:url('../img/bg.gif');
background-repeat: no-repeat;
}

#logo {
	position: relative;
	width: 180px;
	height: 59px;
		top: 50px;
	left: 0px;
	margin-left:60px;
	margin-top:0px;
	background-image: url('../img/logotipo.jpg');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-x-position: 0%;
	background-y-position: 0%;
}

#body-girl {
	position: relative;
	height: 430px;
	width: 232px;
		top: -60px;
	right: -245px;
	margin-right: 0px;
	margin-top:0px;
	background-image: url('../img/body-girl.jpg');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-x-position: 0%;
	background-y-position: 0%;
}

 

Desde já agradeço a paciência.

[David Terra 0]

silverfox ou outro membro, pode tirar essa dúvida para que posso reorganizar o site e por os itens da maneira correta.

[brcontainer 16]

bem com um link ajudaria mais, se tiver fico agradecido.

abraço ;)

[David Terra 0]

Outra dúvida que tenho é em saber pq fica aquele espaço do pé da página com o address.

 

Obrigado!

[Paulo de Tarso F. M. 24]

Olha só, para inserir a imagem da menina como imagem de fundo, terá que ser uma imagem única. Entretanto, isso pode ser ruim, dependendo do tamanho da imagem: se ela for meio "pesada", pode demorar a carregar. Mas não vejo outra maneira semanticamente correta a não ser assim... Ou seja, como percebi que já está usando uma imagem para o fundo (bg.gif), inclua a garota nesta imagem e remova a div responsável por ela no seu código... :unsure:

 

Outra coisa: o que está influenciando nesse afastamento do rodapé é a formatação dos seus banners... Terá que revê-la... Refaça, se possível...

 

Agora não dá, mas se precisar de ajuda, posso te auxiliar nessa reciclagem do código... O que te pediria é que me enviasse uma MP me lembrando que me comprometi a ajudá-lo... (Sabe, às vezes fico fora do fórum e, se me enviam MPs, chega no meu e-mail e aí eu lembro... rsrsrsrs)

 

Boa sorte!