vini_loock Postado Junho 24, 2010 Denunciar Share Postado Junho 24, 2010 Olá.Estou com um problema aki, não faço a minima ideia de como resolver isso aki.O problema é o seguinte:Eu tenho uma estrutura basica html<html> <head> <title>Porta bairros curitiba online.com.br</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" href="estilo.css" type="text/css" /> </head> <body> <div id="global"> <div id="topo"> <div id="logo"></div> <div id="publicidade"></div> <div id="menu"> <ul id="left"> <li><a href="#">Página Inicial</a></li> <li><a href="#">Anuncie</a></li> <li><a href="#">Login</a></li> </ul> <ul id="right"> <li><a href="#">Quem somos</a></li> <li><a href="#">Fale conosco</a></li> </ul> </div> </div> <div id="conteudo"> <div id="busca"> <form> Selecione um bairro e uma atividade para efetuar a busca: <select> <option>Selecione um bairro...</option> <option>Bairro 1</option> <option>Bairro 2</option> </select> <select> <option>Selecione uma atividade...</option> <option>Atividade 1</option> <option>Atividade 2</option> </select> <input type="text"> <input type="submit" value="Buscar"> </form> </div> <div id="texto"> <div id="apresentacao"> <div id="img">dsa</div> <div id="historia">dasd</div> </div> <div id="promocoes"> <ul> <li><a href="#"><img src="" width="150" height="150" border="0" /></a></li> <li><a href="#"><img src="" width="150" height="150" border="0" /></a></li> </ul> </div> </div> <div id="navbar"> <h1 id="titulo">Guia do comércio</h1> <ul> <li><span id="marcador">></span> <a href="#">Academias</a></li> <li><span id="marcador">></span> <a href="#">Academias</a></li> <li><span id="marcador">></span> <a href="#">Academias</a></li> <li><span id="marcador">></span> <a href="#">Academias</a></li> <li><span id="marcador">></span> <a href="#">Academias</a></li> </ul> </div> </div> <div id="rodape"> <h1>Portal Bairros Curitiba Online.com.br</h1> <ul> <li><a href="#">Página Inicial</a></li> <li><a href="#">Anuncie</a></li> <li><a href="#">Classificados</a></li> <li><a href="#">Mural de recados</a></li> <li><a href="#">Links Úteis</a></li> <li><a href="#">Eventos e notícias</a></li> <li><a href="#">Horário de ônibus</a></li> <li><a href="#">Fale conosco</a></li> </ul> <div id="busca"> <form> Selecione um bairro e uma atividade para efetuar a busca: <select> <option>Selecione um bairro...</option> <option>Bairro 1</option> <option>Bairro 2</option> </select> <select> <option>Selecione uma atividade...</option> <option>Atividade 1</option> <option>Atividade 2</option> </select> <input type="text"> <input type="submit" value="Buscar"> </form> </div> <p> 2010 bairroscuritibaonline.com.br Todos os direitos reservados. Política de privacidade<br /> Desenvolvido por: <a href="#">Mks WebDesign</a> </p> </div> </div> </body> </html> E um css mais simples ainda:*{padding: 0px; margin: 0px;} body{background-color: #fff;} #global{/*width: 900px*/ background-color: #fff;} #global #topo{float: center;} #global #conteudo{float: center; margin: 5px; border: 2px solid #55ff55; background-color: #D5FFD5;} #global #conteudo #busca{float: center; margin: 5px; border: 1px solid #55ff55; background-color: #fff; padding: 5px; text-align: center;} #global #conteudo #texto{float: center; margin-left: 5px; margin-top: 0px; margin-right: 290px; margin-bottom: 5px; background-color: #fff; border: 1px solid #55ff55;} #global #conteudo #navbar{float: right; margin: 5px; background-color: #fff; border: 1px solid #55ff55;}Mas o problema é que a div "navbar" ela aparece como se estuvesse fora da div conteudo, dai ela fica abaixo e junto com o rodapé e era pra ela ficar do lado da div "texto".O objetivo, é ficar iguql isso:http://img716.imageshack.us/f/novo.png/Bom.. é isso ai.Vlw Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 *FIT* Postado Junho 24, 2010 Denunciar Share Postado Junho 24, 2010 Pode postar o link? Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 vini_loock Postado Junho 24, 2010 Autor Denunciar Share Postado Junho 24, 2010 http://www.markasom.com.br/teste.html Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 *FIT* Postado Junho 24, 2010 Denunciar Share Postado Junho 24, 2010 Uma saída, não sei se a mais viavel é usar um margin-top negativo, mas não sei como vai funcionar em todos os navegadores, faça um teste.Em todo caso, float center não existe, apenas right ou left.Recomendo usar margin-right para alinhar na posição que deseja, acredito que seja outra solução para resolver seu problema, corrija isso. Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 vini_loock Postado Junho 24, 2010 Autor Denunciar Share Postado Junho 24, 2010 Hm.. infelizmente não posso usar margin-top negativo, poruqe a div conteudo pode variar muito, e também não posso usar float left ou right para a div conteudo, poruqe vai sei layout liquido.Tem alguma alternativa?Eu tava pensando em usar javascript, dai pegaria o tamanho da tela e diminuiria o tamanho da navbar menos a margin e colocaria na div conteudo. Eu vou fazer isso e ver se funciona pelo menos nos principais navegadores.Mas caso exista uma solução com css mesmo, é bem vinda!Vlw Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 vini_loock Postado Junho 24, 2010 Autor Denunciar Share Postado Junho 24, 2010 Opa resolvido!Eu peguei o width da div conteudo, dai diminui a margin e bordas e a navbar, dai deu o resultado da div textosegue o códigofunction tamTexto(){ var width = document.getElementById("conteudo").offsetWidth; var widthNavbar = "250"; var margin = "15"; var borda = "4"; var soma = width-widthNavbar-margin-borda; document.getElementById("texto").style.width = soma; }Vlw Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 *FIT* Postado Junho 24, 2010 Denunciar Share Postado Junho 24, 2010 Bom, uma boa saída, eu ia pensar em um modo com CSS mesmo, mas pelo que vejo assim já está funcionando bem, acredito que no eu estava pensando iria ter que mudar um pouco a estrutura do CSS, não sei se valeria a pena ter que quase refazer. Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
vini_loock
Olá.
Estou com um problema aki, não faço a minima ideia de como resolver isso aki.
O problema é o seguinte:
Eu tenho uma estrutura basica html
E um css mais simples ainda:Mas o problema é que a div "navbar" ela aparece como se estuvesse fora da div conteudo, dai ela fica abaixo e junto com o rodapé e era pra ela ficar do lado da div "texto".
O objetivo, é ficar iguql isso:
http://img716.imageshack.us/f/novo.png/
Bom.. é isso ai.
Vlw
Link para o comentário
Compartilhar em outros sites
6 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.