Postagens
Não informado
Olá amigo.
Ficou bom o site.
Eu daria apenas duas sugestões para deixa-lo ainda melhor.
O background, no meu ponto de vista, está conflitando um pouco com o layout.
E o campo de busca eu mudaria para o lado esquerdo, visto que é o foco do site, e o ponto mais visto pelo usuário.
Att
Maikon
Posts I've Made
In Topic: Posicionamento
27/01/2008, 10:41
Valeu pelas dicas, corrigido!
No topo, preciso usar o logo em imagem, para seguir o layout que foi desenhado... então eu fiz assim:
1. Criei uma div com o topo, um background com um gif de 2px de largura. Assim o topo estaria feito, e sobre o topo colocaria o logo e o telefone.
Eu coloquei o CSS com float... e o logo colou em cima de novo...
veja:
CSS
html
Estou bem confuso ainda.. hehe.. anos de tabelas... hehe
No topo, preciso usar o logo em imagem, para seguir o layout que foi desenhado... então eu fiz assim:
1. Criei uma div com o topo, um background com um gif de 2px de largura. Assim o topo estaria feito, e sobre o topo colocaria o logo e o telefone.
Eu coloquei o CSS com float... e o logo colou em cima de novo...
veja: CSS
* { margin:0px; padding:0px; border:0px; list-style-type:none; }
html { }
body { font:11px Verdana, Arial, Helvetica, sans-serif; color:#ff0000; background:#8DB0BF url("../imagens/back.gif") top repeat; cursor:default; height:100%; text-align:center; /* hack para o IE centrar o layout */ }
#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 .telefone {float:right; padding:20px 20px 0 0;}html
<!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"> <img src="imagens/logo.gif" id="logo" alt="Voltar para página inicial" /> <span id="telefone">11 6198-3927 </span> </div> </div> </body> </html>
Estou bem confuso ainda.. hehe.. anos de tabelas... hehe
In Topic: Posicionamento
26/01/2008, 22:20
Você pode criar definições para a imagem e definições diferentes para o texto que você pode colocar dentro de um parágrafo com as margens definidas como você precisa.
Tentei... e nada...
Rola um exemplinho?
Veja o que fiz:
<div id="conteudo"> <div id="topo"> <img src="imagens/logo.gif" id="logo" alt="Voltar para página inicial" /> <span id="telefone">11 6198-3927 </span> </div> </div>
#logo {position: relative; margin-top: 15px; margin-left: 20px;}
#telefone { position: relative; margin-toptop: 24px; margin-right: 15px; }O logo ta onde quero!
