[Resolvido] Posicionar menu dropdown ao centro no IE6
Pessoal,
Estou com site rodando normalmente no IE 8 e 9 e no Firefox, no entando os problemas se apresentam no IE 6 quero fazer um hack para IE 6, mas não consigo arranajar meu css de forma a manter o menu dropdawn centralizado no IE6.
Seguem os códigos, se alguem puder me ajudar a centralizar o menu no Ie ficarei muito agradecido!
ele esta rodando nesse link: http://www.sutel.com.br/ppgcm2.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="en" lang="en">
<head>
<title>Programa de Pós-Graduação em Medicina: Ciências Médicas</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/ppgcm.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/default.ultimate.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/url.js"></script> <!-- JS para abrir forms na div cont por meio do comandos [ javascript:ajax_url('areasDeConcentracao-f.php', 'conteudo' ); ] --><!--[if lt IE 7]>
<script type="text/javascript" src="js/jquery/jquery.js"></script>
<script type="text/javascript" src="js/jquery/jquery.dropdown.js"></script><![endif]-->
<!-- / END -->
</head>
<body>
<!-- <SPAN style="position: absolute; top: 100 px; left: 25px; width: 100px; height: 150px">
<IMG SRC="css/images/ufrgslogo.gif" >
</SPAN> -->
<div id="total">
<div id="topo">
<h1><img id="img" src="css/images/ufrgslogo.gif" width="100" height="75" alt="PPGCM" /> <img src="css/images/ppgcm.jpeg" width="500" height="75" alt="PPGCM" /> <img src="css/images/famed.gif" width="100" height="75" alt="FAMED" />
</h1>
</div><!-- Beginning of compulsory code below -->
<div id="menu">
<ul id="nav" class="dropdown dropdown-horizontal">
<li id="n-music"><a href="ppgcm2.html"> Home </a></li>
<li id="n-music"><a href="./" class="dir">Equipe </a>
<ul>
<li class="first"><a href="./" class="dir">Coordenação</a>
<ul>
<li><a href="javascript:ajax_url('wc.html', 'cont' );">Wolnei Caumo</a></li>
<li><a href="./">Vice-Coordenador</a></li>
<li><a href="./">Suplente 1</a></li>
<li><a href="./">Suplente 2</a></li>
<li><a href="javascript:ajax_url('credenciamentos2.html', 'cont' );" title="Categorias" alt="credenciamentos">Credenciamentos</a></li>
</ul>
</li>
<li class="first"><a href="./" class="dir">Secretaria</a>
<ul>
<li class="first"><a href="./">Vera</a></li>
<li><a href="./">Estagiário 1</a></li>
<li><a href="./">Estagiário 2</a></li>
<li><a href="./">Estagiário 3</a></li>
</ul>
</li>
</ul>
</li>
<li id="n-music"><a href="./" class="dir">Cursos </a>
<ul>
<li class="first"><a href="./"><strong>Mestrado</strong></a></li>
<li><a href="./">Doutorado</a></li>
</ul>
</li>
<li id="n-music"><a href="./" class="dir">Documentos</a>
<ul>
<li class="first"><a href="./">Geral</a></li>
<li><span class="dir">Editais</span>
<ul>
<li class="first"><a href="./">Doutorado Fluxo Contínuo</a></li>
<li><a href="./">Doutorado, ingresso direto</a></li>
<li><a href="./">Edital CNPq Nº 10/2010 - Bolsas de Apoio Técnico</a></li>
<li><a href="./">Edital MCT/CNPq N º 12/2010- Bolsas de Iniciação Cientifica</a></li>
<li><a href="./">Programa CAPES/NUFFIC </a></li>
</ul>
</li>
<li><span class="dir">Formulários</span>
<ul>
<li class="first"><a href="./">Solicitação de Banca de Mestrado</a></li>
<li><a href="./">Solicitação de Banca de Doutorado</a></li>
<li><a href="./">Solicitação de Exame de Qualificação de Doutorado</a></li>
<li><a href="./">Formulário Solicitação de Bolsa e Termo de Compromisso</a></li>
<li><a href="./">Ficha para Estagio Docente</a></li>
</ul>
</li>
<li><span class="dir">Legislação UFRGS</span>
<ul>
<li class="first"><a href="./">Regimento do PPGCM</a></li>
<li><a href="./">Normas para apresentação de dissertações e teses</a></li>
<li><a href="./">Normas para apresentação de projetos de pesquisas (mestrado, doutorado e exame geral de qualificação)</a></li>
<li><a href="./">Normas Pós-Doutorado - UFRGS</a></li>
</ul>
</li>
</ul>
</li>
<li id="n-music"><span class="dir">Ensino </span> <!-- PRIMEIRO NIVEL -->
<ul>
<li class="first"><a href="./" class="dir">Professores</a>
<ul>
<li class="first"><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
<li><a href="./">xxx</a></li>
</ul>
</li>
<li><a href="./" class="dir">Disciplinas</a>
<ul>
<li class="first"><span class="dir">Mestrado</span>
<ul>
<li class="first"><a href="./">MED 074</a></li>
<li><a href="./">MED 062</a></li>
<li><a href="./">MED 110</a></li>
<li><a href="./">MED 099</a></li>
<li><a href="./">MED 085</a></li>
<li><a href="./">MED 120</a></li>
</ul>
</li>
<li><a href="./" class="dir">Doutorado</a>
<ul>
<li class="first"><a href="./">MED 077</a></li>
<li><a href="./">MED 000</a></li>
<li><a href="./">MED 111</a></li>
</ul>
</li>
<li><a href="./">xxxx</a></li>
</ul>
</li>
<li><a href="./" class="dir">YYY</a>
<ul>
<li class="first"><a href="./">YYY</a></li>
<li><a href="./">YYY</a></li>
<li><a href="./">YYY</a></li>
<li><a href="./">YYY</a></li>
</ul>
</li>
<li><a href="./">ZZZ</a></li>
<li><a href="./" class="dir">TTT</a> <!-- SEGUNDO NIVEL -->
<ul>
<li class="first"><span class="dir">LLL</span> <!-- TERCEIRO NIVEL -->
<ul>
<li class="first"><a href="./">AAA</a></li> <!-- QUERTO NIVEL -->
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAA</a></li>
<li><a href="./">AAAL</a></li>
<li><a href="./">AAA</a></li>
</ul>
</li>
<li><a href="./">FFF</a></li>
<li><a href="./">DDD</a></li>
<li><a href="./">KKK</a></li>
<li><a href="./">III</a></li>
<li><a href="./">MMM</a></li>
</ul>
</li>
<li><a href="./">QQQ</a></li>
</ul>
</li>
<li id="n-music"><span class="dir">Contato </span> <!-- PRIMEIRO NIVEL -->
</ul>
</div>
<div id="cont">CONTEUDO
</div>
<div id="base">
<center>
<div id="base2"><font size="1"><b> PPG em Ciências Médicas - Rua Ramiro Barcelos, 2400 - 2º andar • Tel.: 51 3308-5605 • Porto Alegre - RS - Brasil • ppgcm@ufrgs.br</b></font></div>
</center>
</div>
</div><!-- / END -->
</body>
</html>default.css
@charset "UTF-8";
/*------------------------------------------------------------------------------------------------------/
@section Style Framework */
/ First-level expected directory tag - li /
ul.dropdown li {
padding: 5px;
}ul.dropdown *.dir {
padding-right: 30px;
background-image: none;
background-position: 100% 50%;
background-repeat: no-repeat;
}
/* Non-first level */
ul.dropdown ul *.dir {
padding-right: 15px;
background-image: url(images/nav-arrow-right.png);
background-position: 100% 50%;
background-repeat: no-repeat;
}
ul.dropdown ul ul *.dir {
background-image: url(images/nav-arrow-right2.png);
}/ Components override /
ul.dropdown-vertical *.dir {
background-image: url(images/nav-arrow-right.png);
}ul.dropdown-vertical-rtl *.dir {
padding-right: 15px;
background-image: url(images/nav-arrow-left.png);
background-position: 0 50%;
}/*------------------------------------------------------------------------------------------------------/
@section Base Drop-Down Styling */
/ ALL LEVELS (incl. first) /
ul.dropdown {
font: bold 17px/normal Arial, Helvetica, sans-serif;
}
ul.dropdown li {
background-color: #333;
color: #fff;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
}
/* Links */
ul.dropdown a:link,
ul.dropdown a:visited { color: #fff; text-decoration: none;}
ul.dropdown a:hover {
border-top-color: #5db1e0 !important;
border-left-color: #5db1e0;
background-color: #4498c7;
color: #fff;
}
ul.dropdown ul a.dir:hover { /* proposal */
background-color: #4698ca;
background-image: url(images/comnav-arrowon.png);
color: #fff;
}
ul.dropdown a:active {
background: #058acf url(images/nav-sub-press.png) 0 0 repeat-x !important;
color: #fff;
}
/* NON-FIRST LEVEL */
ul.dropdown ul {
left: auto;
right: 0;
width: 150px;
margin-top: -1px;
border-top: 1px solid #1a1a1a;
border-left: solid 1px #4c4c4c;
font: bold 11px/1em Tahoma, Geneva, Verdana, sans-serif;
}
ul.dropdown ul li {
background-color: #3a3a3a;
}
ul.dropdown ul ul {
top: 0;
right: auto;
left: 100%;
margin-top: 0;
border-top: none;
border-left: none;
font-weight: normal;
}
ul.dropdown ul ul li {
background-color: #4c4c4c;
}
ul.dropdown ul ul ul li {
background-color: #595959;
}/ Mixed /
ul.dropdown li a,
ul.dropdown *.dir {
border-style: solid;
border-width: 1px;
border-color: #404040 #1a1a1a #1a1a1a #505050;
}ul.dropdown ul li a,
ul.dropdown ul *.dir { border-color: #4a4a4a #242424 #242424; border-left: none; }
ul.dropdown ul ul li a,
ul.dropdown ul ul *.dir { border-color: #595959 #333 #333; }
ul.dropdown ul ul ul li a,
ul.dropdown ul ul ul *.dir { border-color: #767676 #404040 #404040; }
/ Custom elements /
#n-movies { width: 250px; text-align: center; }
#n-movies ul { right: auto; left: 0; width: 249px; text-align: left; }
#n-movies ul ul { left: 249px; width: 150px; }
#n-movies ul a { width: 232px; }
#n-movies ul a.dir { width: 210px; }
#n-movies ul ul a { width: 133px; }
#n-movies ul ul a.dir { width: 111px; }
#n-movies ul ul ul { left: 100%; }
default.ultimate.css
@import "default.css";
/*------------------------------------------------------------------------------------------------------/
* @section Base Style Extension
*/
ul.dropdown a,
ul.dropdown span {
display: block;
padding: 5px 30px;
}/*------------------------------------------------------------------------------------------------------/
* @section Base Style Override
*/
ul.dropdown li {
padding: 0;
}ul.dropdown ul a,
ul.dropdown ul span { / POI, proposal: override abstract a, span /
padding: 8px;
}/*------------------------------------------------------------------------------------------------------/
* @section Base Style Reinitiate: post-override activities
*/
ul.dropdown .dir { / POI */
padding: 5px 30px;
}ul.dropdown ul *.dir {
padding: 8px 30px 8px 8px;
}/*------------------------------------------------------------------------------------------------------/
* @section Custom Styles
*/
ul.dropdown ul a {
width: 133px;
}ul.dropdown ul a.dir {
width: 111px;
}/*------------------------------------------------------------------------------------------------------/
* @section Support Class open Usage
* @source js, artificial
*
*/
ul.dropdown *.open {
background-color: #3d3d3d;
}ul.dropdown ul *.open {
background-color: #4c4c4c;
background-image: url(images/comnav-arrowover.png);
color: #fff;
}ul.dropdown ul ul *.open {
background-color: #595959;
background-image: url(images/comnav-arrowover2.png);
color: #fff;
}/ Override UPPER TWO definitions /
ul.dropdown a.open:hover {
background-color: #4698ca;
color: #fff;
}ul.dropdown ul a.open:hover {
background-image: url(images/comnav-arrowon.png);
color: #fff;
}/ Clone in CSS 2 /
ul.dropdown li:hover > *.dir {
background-color: #3d3d3d;
}ul.dropdown ul li:hover > *.dir {
background-color: #4c4c4c;
background-image: url(images/comnav-arrowover.png);
}ul.dropdown ul ul li:hover > *.dir {
background-color: #595959;
background-image: url(images/comnav-arrowover2.png);
color: #fff;
}/ Override UPPER TWO definitions /
ul.dropdown li:hover > a.dir:hover {
background-color: #4698ca;
color: #fff;
}ul.dropdown ul li:hover > a.dir:hover {
background-image: url(images/comnav-arrowon.png);
color: #fff;
}dropdown.css
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 5;
}ul.dropdown {
position: absolute;
z-index: 597;
}ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
}ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
cursor: default;
}ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
}ul.dropdown ul li {
float: none;
}ul.dropdown ul ul {
top: 1px;
left: 99%;
}ul.dropdown li:hover > ul {
visibility: visible;
}ppgcm.css
* { margin: 0;
padding: 0; }body {
margin:0 auto;
position:relative;
padding: 10px 15px;
text-align: center;
background: #FFFFFF 0 0 repeat-x;
color: black;
font: 14px/normal Tahoma, Arial, Helvetica, sans-serif;
width: 784px;
}
#total{
width: 250;
padding: 0;
background: #2696B8;
text-align: center;
display: block;
color: black;
font-size: 13px;
margin-top: 10px;
line-height: 32px;
}
#topo{
margin-top: 10PX;
width: 784px;
background: white;
line-height:15px;
text-align: center;
letter-spacing: 1px;
display: block;
color: black;
font-size: 13px;
margin-top: 0px;
line-height:30px;
}#topo#ufrgs {
vertical-align: left;
text-align: left;
}
#img{
position:relative;
left:-4%;
top:50%;
padding-top: 5px;
}span.diferente {
vertical-align: 21px;
margin-left: 1px;
}span.diferente2 {
vertical-align: 1px;
font-weight: 101;
}
#cont{
background: white;
margin-top: 40PX;
width: 750;
float:right;
position:relative;
text-align:center;
font-size: 18px;
border:4px;
border-color:#000000;
line-height:30px;
}
#form{
background: url(images/cinza2.jpg);
min-height: 900px;
position:relative;
text-align:center;
font-size: 18px;
border:4px;
border-color:#000000;
line-height:30px;
}
#base{
background: white;
width:780;
height:80px;
top:500px;
text-align:center;
margin:0px;
line-height:37px;
clear:both;
}
#base2{
background: #2696B8;h1 {
margin-bottom: .5em;
border-bottom: solid 1px #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 180%;
text-indent: 5px;letter-spacing: -1px; }
cite { float: right; }
ul.classic { list-style: disc;
margin-bottom: 1em;padding-left: 2em; }
div.section { clear: both;
padding-top: 50px; }
.table1 { float: right; margin-bottom: 2em; border: solid 1px #eee; }
.table1 caption { color: #fff; text-align: center; padding-bottom: 5px; }
.table1 th, .table1 td { padding: 7px; }
.table1 th, .table1 thead td { background-color: lightyellow; color: #000; }
.table1 tbody td { background-color: #fff; color: #000; }
.table1 tbody th { text-align: right; }
Discussão (2)
Carregando comentários...