Jump to content


rodolphonetto

Member Since 01/07/2010
Offline Last Active 07/03/2011, 16:58
-----

Topics I've Started

Problemas Para Posicionar Conteudo Da Div

03/03/2011, 16:48

Eae Pessoal

estou começando agora a programação de sites com tableless, estava acustumado a montar sites com editores visuais tipo web page maker, sem nem me preucupar com o q era xhtml ou mesmo css, porem de algumas semanas pra ca devido a faculdade fui instruido a abandonar este procedimento e começar a programar em xhtml + css, então estou tendo minhas dificuldades, mas entendendo o quanto é importante supera-las estou em busca de material e tirando duvidas, então la vai:

meu principal problema é como posicionar as imagens, textos e outros dentro do site segue meus códigos e como a pagina está e deveria ficar.
Pagina xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br">
<head>

  <meta content="text/html; charset=UTF-8" />
  <title>Página Inicial Jornal</title>

	<link rel="stylesheet" type="text/css" href="style.css" />
  	<meta content="Rodolpho Netto" name="author" />

</head>

<body>
	<div id="banner">
		<img src="banner.jpg" alt="Banner Principal" />
	</div>
		
		<div id="noticia">
	<h2>Noticia 1</h2>
<p>
	No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
	No No No No No No No No No No No No No No No No No No No No No 
</p>
<div id="imagem"><img src="jornal.gif" alt="Jornal" /></div>
</div>
	
	<div id="menu">
		<ul>
			<li><a href="noticia1.html">Noticia1</a></li>
			<li><a href="noticia2.html">Noticia2</a></li>
			<li><a href="noticia3.html">Noticia3</a></li>
			<li><a href="noticia4.html">Noticia4</a></li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
			<li>Demais Noticias</li>
		</ul>
	</div>

	<div id="validacao">
	
    			<a href="http://validator.w3.org/check?uri=referer"><img
      			src="http://www.w3.org/Icons/valid-xhtml10"
        		alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a>
  
	</div>
	
	<div id="css"
	 		<a href="http://jigsaw.w3.org/css-validator/check/referer">
        		<img style="border:0;width:88px;height:31px"
            		src="http://jigsaw.w3.org/css-validator/images/vcss"
            		alt="CSS válido!" />
    			</a>
	</div>

</body>
</html>

CSS dessa pagina

body {color:#000000; background-color:#D4DDE4; border:Black Medium Solid; }

#noticia {  margin-left:280px; margin-right:280px; border:Black Medium Dashed; padding:10px; 
}

#noticia p {
text-align:Justify;
}

#noticia h2 {
text-decoration:underline; text-align:Center; color:#000000; font-family:Arial, Helvetica, sans;
}

#imagem {
text-align: center;
}


#menu ul {font-weight:bold; list-style-type:square; position:absolute;
overflow:hidden;
left:110px;
top:149px;
border:Black Medium Dashed; padding:25px; padding-bottom:13px; }

#banner {text-align:Center; }

#jornal {text-align:Center; }

#menu li {}

#jornal {
position:absolute;
left:450px;
top:217px;

}


#validacao {
text-align:center;
left:110px;
top:149px;
}

#css {
text-align:center;
}

Atualmente ela está assim e na imagem mostra onde eu quero colocar e não consigo:
Posted Image

Uploaded with ImageShack.us

IPB Skin By Virteq