Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Acho que a melhor forma de vocês me ajudarem é vendo o problema, então coloquei abaixo os prints.
Tenho um cabeçalho que possui uma MARCA (amarelo), um INPUT button e dois LINKS.
/applications/core/interface/imageproxy/imageproxy.php?img=http://eltonvinicius.com.br/etc/01.jpg&key=76855e048f38a06f9a00002551399b895766b7320516d43aac77db9d70c4a008" alt="Imagem Postada" />
Quando eu redimensiono a janela do navegador, quero que o input e os links acompanhem a janela, como na figura abaixo:
/applications/core/interface/imageproxy/imageproxy.php?img=http://eltonvinicius.com.br/etc/02.jpg&key=39d8e330458d52aa0ba9d77ccf9959a56c89fe6e9ad20044c1556650c3289e6f" alt="Imagem Postada" />
O problema é que se a janela ficar muito pequena a DIV (top_botoes) que comporta o input e os links desce, como nesse print:
/applications/core/interface/imageproxy/imageproxy.php?img=http://eltonvinicius.com.br/etc/03.jpg&key=1bfe191bfb353efff82f9638536af98d65950fafc565031c4e8a8866690b9997" alt="Imagem Postada" />
Eu eu queria que elas permanessem no cabeçalho sem descer para baixo da marca (top_marca), como nessa imagem.
/applications/core/interface/imageproxy/imageproxy.php?img=http://eltonvinicius.com.br/etc/04.jpg&key=de7f9cab2273d846ae80632df9a648408b65032cd0a708a9110e83c97943e3f5" alt="Imagem Postada" />
Isso é possível?
Utilizei o position:fixed mas desta forma eu não consigo fazer com que o INPUT e os LINKS deslizem quando a janela é redimencionada(segunda imagem)
Segue o HTML e o CSS da página:
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<style type="text/css">
<!--
.top{float:left; height:46px; width: 100%; background-image: url(images/bgdiv1.gif);background-repeat: repeat-x; display:block;}
.top_marca {float:left; width: 160px;}
input {float:left; width: 170px; margin: 10px 0px 0px 0px;}
.top_botoes {float:right;}
.top_links {float:left; width: 150px; margin: 13px 0px 0px 50px;}
.top_links a:link {font-family: Verdana;font-size: 11px;color: White;text-decoration: none;}
.top_links a:visited{font-family: Verdana, Arial; font-size: 11px; color: White; text-decoration: none; }
body {background-color:#000000;}
-->
</style>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste</title>
</head>
<body>
<div class="top">
<div class="top_marca">
<img src="images/marca.jpg" />
</div>
<div class="top_botoes">
<input name="criar" type="button" value="CRIAR" />
<div class="top_links">
<a href="#">Link</a>
<a href="#">Link</a>
</div>
</div>
</div>
</body>
</html>Carregando comentários...