http://img36.imagesh...i/87366401.jpg/
a imagem de cima e no nvegador, a de baixo no DW a questão e que no DW mostar que as duas boxes estão perfeitamente alinhadas, ai eu vejo no navegador fica desalinhado.
html:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="staile.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<script>startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace
(" over", "");
}
}
}
}
}
window.onload=startList;</script>
</head>
<body>
<div id="conteudo">
<div id="topo">
<div id="boxTop">
<div id="ultimas">ultimas em php</div>
<div id="novidades">novidades em phpasadssassadassadsadsadasdsd asda asd </div></div>
</div>
<div id="baner"><ul id="MenuBar1" class="MenuBarVertical">
<li><a class="MenuBarItemSubmenu" href="#">Trabalhos</a>
<ul>
<li><a href="#">Fanzine</a></li>
<li><a href="#">Fanart</a></li>
<li><a href="#">Fanfic</a></li>
<li><a href="#">Dicas</a></li>
<li><a href="#">Cosplay</a></li>
<li><a href="#">Ajuda</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu"href="#">Media</a>
<ul>
<li><a href="#">Musicas</a></li>
<li><a href="#">Letras/lyrics</a></li
><li><a href="#">Ost's</a></li>
<li><a href="#">Episodios</a></li>
<li><a href="#">Filmes</a></li>
<li><a href="#">Ovas</a></li>
<li><a href="#">Roms</a></li>
<li><a href="#">Guias</a></li>
<li><a href="#">Wallpapers</a></li>
<li><a href="#">Signature</a></li>
<li><a href="#">Userbar</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Utilidades</a>
<ul>
<li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
<ul>
<li><a href="#">Item 3.1.1</a></li>
<li><a href="#">Item 3.1.2</a></li>
</ul>
</li>
<li><a href="#">Item 3.2</a></li>
<li><a href="#">Item 3.3</a></li>
</ul>
</li>
<li><a href="#">Item 4</a>
<ul>
<li><a href="#">Item 4.1</a></li>
<li><a href="#">Item 4.2</a></li>
<li><a href="#">Item 4.3</a></li>
<li><a href="#">Item 4.4</a></li>
<li><a href="#">Item 4.5</a></li>
<li><a href="#">Item 4.6</a></li>
<li><a href="#">Item 4.7</a></li>
</ul>
</li>
</ul>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script></div>CSS:
@charset "utf-8";
/* CSS Document */
*{margin:0;padding:o;}
body{background:url(../images/bgbody.jpg) repeat-y;}
#conteudo{width:768px;height:100%; margin: 0 auto; text-align:center}
#topo{background:url(../images/topo.gif) no-repeat; height: 108px;}
#baner{background:url(../images/baner.gif) no-repeat; height: 207px;}
#content{background:url(../images/menu_b.gif) repeat-y; height: 35px;}
#content-esquerdo{background:url(../images/pub1.gif);width:485px;height:76px;float:left;}
#content-meio{background:url(../images/pub_r.gif);width:104px;height:119px;float:right;}
#content-direito{background:url(../images/menu2.jpg);width:179px;height:322px;float:right;}
#new-esquerdo{background:url(../images/new1.gif);width:485px;height:147px;float:right;}
#new-esquerdo-bot{background:url(../images/new1.gif);width:485px;height:147px;float:left;}
#box{background:url(../images/box.jpg);width:105px;height:84px;float:right;}
#box-direita{background:url(../images/box1.gif);width:283px;height:151px;float:right;}
#bg-content{background:url(../images/bg_content.gif);width:485px;height:26px;float:left;}
#barrinha{background:url(../images/bar.gif);width:768px;height:10px;float:right;margin-top: -1px;}
#rodape{background:url(../images/rodape.gif) no-repeat;width:768px;height:27px;float:left;}
#cop{background:url(../images/cop.gif);width:768px;height:41px;float:left;}
#boxTop {margin-left:245px;margin-top:25px;}
#ultimas{float:left;width:245px;height:75px;display:block;}
#novidades{height:75px;color:#990;margin-left:270px;}
#centro {
width: 485px;
float: left;
}
#barra_right {
width: 283px;
float: left;
}
#contents {
width: 104px;
float: left;
}
ul#MenuBar1 {
margin-left: 107px;
}
ul {
margin-left: 15px;
padding: 0;
list-style: none;
width: 150px; /* Width of Menu Items */
}
ul li {
position: relative;
}
li ul {
position: absolute;
left: 149px; /* Set 1px less than menu width */
top: 0;
display: none;
}
/* Styles for Menu Items */
ul li a {
display: block;
text-decoration: none;
color: #777;
background: #fff; /* IE6 Bug */
padding: 5px;
}
/* Holly Hack. IE Requirement \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
li:hover ul, li.over ul { display: block; } /* The magic */alguem sabe qual seria o problema? :poconfu:
