Posicionamento das div's

[p.d 0]

Ola a todos.. olha eu com um problama. Quase tudo funciona no layout, mas tenho um menu que deve ficar centralizado com largura de 780px e isso esta ok .. mas na mesma linha desse menu do lado direito na largura maxima do navegador existe uma outra div. No FF funciona normalmente mas no IE a div que esta à direita do menu esta descendo exatamento a altura do menu.

 

No FF:

No IE:

 

//_________________________________________________

// agora o css + html

 

HTML

<div id="menu">			<div id="mlinks">				<ul>					<li><a href="home.htm"><img src="imagens/menu_home.png" width="39" height="11" /></a></li>					<li><a href="quem.htm"><img src="imagens/menu_quem.png" width="87" height="13" /></a></li>					<li><a href="objetivos.htm"><img src="imagens/menu_objetivos.png" width="65" height="15" /></a></li>					<li><a href="servicos.htm"><img src="imagens/menu_servicos.png" width="55" height="15" /></a></li>					<li><a href="equipe.htm"><img src="imagens/menu_equipe.png" width="46" height="14" /></a></li>					<li><a href="prevencao.htm"><img src="imagens/menu_prevencao.png" width="69" height="15" /></a></li>					<li><a href="faleconosco.htm"><img src="imagens/menu_fale.png" width="84" height="11" /></a></li>				</ul>			</div>			<div id="data">				<p>					<script>						var now = new Date();						var day = now.getDate();						var month = now.getMonth()+1;						var year = now.getFullYear()						var theDay = "" + day + "/" + month + "/" + year;						document.write(theDay);					</script>				</p>			</div>		</div>

CSS:

html {	height:100% !important;	}body,h1,p {	margin:0;	padding:0;	}body {	margin:0;	text-align:center;	background:#FFF6F8 url(../imagens/bg_body.jpg);	overflow:auto;	}img {	border:0;	}#menu {	height:35px;	background:url(../imagens/bg_menu.jpg) repeat-x;	}#mlinks {	width:780px;	margin:0 auto;	text-align:left;	}#mlinks ul {	margin:0;	padding:0;	list-style:none;	}#mlinks ul li {	float:left;	}#mlinks ul li a {	display:block;	padding:10px 15px 0 0;	}#data {	width:136px;	height:35px;	float:right;	background:url(../imagens/bg_data.png) no-repeat top left;	font:12px "Trebuchet MS", Verdana;	color:#fff;	}#data p {	padding:6px 0 0 0;	}

Acho que ja tentei tudo que um mortal do css pode fazer kk .. agora dependo de voces os imortais! Tudo de bom pra voces e espero que me ajudem ...

[Guilherme Rambo 4]

#mlinks {	width:780px;	margin:0 auto;	text-align:left;float:left;	}

Se pah...

 

[]'s

[p.d 0]

Massa isso eu tinha tentando a talz e funfou mas nao fica do jeito que eu quero ! Na pagina tem que ficar centralizado o menu e do lado direito o Data.Desse jeito que voce propoz fica de um lado o menu e do outro a data. Nao tem como alinhar dois objetos um no centro e outro no lado ?

[Guilherme Rambo 4]

Ja tentou fazer isso com positions?Dá uma olhada nos tutos do laboratório WS, tem algo sobre isso...[]'s

[p.d 0]

Eu pensei em fazer o posicionamento com Position absolute na div Data. Da certo qndo eu posiciono na altura mas qndo posiciono o left eu teria que colocar algo parecido com :left:100%-136px;Mas acho que isso nao eh possivel com o css ... tem como eu posicionar aquela div de forma que fique colada do lado direito do navegador?

[webflex 0]

Olá,

 

Experimente colocar um width: 916px; na div menu. Eu não testei seu código, quando tiver tempo e se o problema persistir verei isso ;).

 

Cumps \o/

[p.d 0]

Opa galera valeu ae por tentar ajudar .. sobre o post do "webphlex" colocar um valor assim numeral nem ia rolar porque dependendo da resolucao do cara esse numero varia entao nao ia funcionar .. entao tentei usar positions como o "#inside#" disse. Coloquei a div como position:absolute; ae funcionou... ta ae o css alterado:

#data {	position:absolute;	top:100px;	width:50%;	left:50%;	height:35px;	background:url(../imagens/bg_data.png) no-repeat top right;	font:12px "Trebuchet MS", Verdana;	text-align:right;	color:#fff;	}#data p {	padding:6px 30px 0 0;	}

Abraço a todos!

[p.d 0]

Opa Opa .. tava bom dimais pra ser verdade ne.. kkk

Odeio a Microsoft e seu IE. Seguite: aconteceu que agora funciona corretamente no FireFox 1.5 e 2.x , funciona tambem no IE 7 mas no IE 6 nao funfa.

Mas pelo visto a solução mesmo é usar position mas preciso de um jeito de fazer essa div ficar colada do lado direito da janela como fica agora no IE7 e no FF. Abaixo tem um link para verem como funciona a coisa toda.

 

http://br.publicar.com/centrooeste/clinicadamama/

 

Precisando de um ultimo help mesmo ! valeu galera.

[Paulo de Tarso F. M. 24]

#data {

position:absolute;

top:100px;

width:100%;

left:0; --> right:0;

height:35px;

background:url(../imagens/bg_data.png) no-repeat top right;

font:12px "Trebuchet MS", Verdana;

text-align:right;

color:#fff;

}

Altere a propriedade left para right...

[p.d 0]

Obrigadao Paulo mas ainda persiste essa nhaca. Funciona no FF e no IE7. Mas fica errado no IE6. Abaixo os links dos prints no FF, IE7 e IE6 para voces verem o meu problema:

 

• PRINT NO FF

 

• PRINT NO IE7

 

• PRINT NO IE6

 

Mais alguma ideia ?

[p.d 0]

Perdão do Flood mas alguem tem alguma ideia que possa ajudar esse pobro cssNoob? Obrigado pela atenção de todos...

[Paulo de Tarso F. M. 24]

Agora que reparei... Por que você está usando uma largura de 100% (width) nessa div? Tenta especificar um tamanho certo para ela e veja se funciona... Abraço!

[p.d 0]

Valeu Paulo. Deu certo. Brigadão ... Ok:)