Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

mkboy

Posicionamento

Por , em Desenvolvimento frontend

Recommended Posts

mkboy    1

mkboy
Postado

Olá amigos,

 

Este é o primeiro layout que estou arriscando desenvolver com CSS.

 

Imagem Postada

 

Montei a div do conteúdo, centrada com 778px.

Dentro dela, montei a div do topo, onde coloquei outra div, para o logotipo, onde eu queria, a 20px do limite da esquerda, e 20px do limite do topo.

Ainda dentro da div do topo, eu criei outra div, para o telefone, que não apareceu como eu queria, a 20px também do topo, e a 20 do limite da direita.

 

Podem me ajudar a entender porque não ficou no lugar que deveria.

(Estou usando com base de pesquisa o site do majour)

 

Meu HTML

 

<XHTML; 1.0 Strict !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" xml:lang="pt-br" lang="pt-br">
	<head>
		<title>mkhost | HOSPEDAGEM PROFISSIONAL DE SITES</title>
		<link href="includes/estilos.css" media="all" rel="stylesheet" type="text/css">
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	</head>

	<body>
	<div id="conteudo">
		<div id="topo">
			<div class="logo"><img src="imagens/logo.gif" /></div>
			<div class="telefone">11 6198-3927</div>
		</div>
	</div>
	</body>
</html>

O Css referente ao topo:

 

#conteudo 
{margin: 0 auto; 
border-left: 2px solid #ffffff; 
border-right: 2px solid #ffffff; 
width: 778px; height:100%; 
background-color: #8DB0BF;  }

/* Definindo o topo do site */

	#topo 
	{margin: 0 auto; 
	border-left: 1px solid #ffffff; 
	border-right: 1px solid #ffffff; 
	width: 765; height:81px; 
	text-align:left; 
	background:#fff url("../imagens/backTopo.gif"); /* "remédio" para o hack do IE */}
	.logo 
	{position: relative; 
	top: 20px; 
	left: 20px;}
	.telefone { 
	position: relative; 
	top: 24px; 
	left: 651px;}

A página está em http://www.mkhost.com.br/index.asp

 

Tentei validar no http://validator.w3.org/, só que da erro, não entendi onde esta o erro.

Estou escrendo em Xhtml strict, para aprender a escrever da forma correta.

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

ae seu problema não é com validação, a validação te ajuda mas não exatamente com isso.

outra trabalhar com position pode ser meio "ruim" em alguns casos

acredito que se ao inves de position você der uma lida nos artigos de como estruturar layouts

vai lhe ajudar bastante

http://forum.imasters.com.br/index.php?showforum=140

abraço ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito