Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Opa
Inicialmente meu código não ficava direito no IE8 mas arrumei a consigui deixa padrão no IE e no firefox, só que baixei o chrome e ficou tudo desalinhado...
Alguém tem uma sugestão de programação, um artigo,dica ou tutorial que possa me ajudar a criar um site padronizado para a maioria dos browsers ?
abs
um link vo ficar te devendo...
o form fica no canto direito superior sendo q devia ficar no meio...
mas o código ta aqui:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
<title>Login</title>
<style type="text/css">#menu_login {
float:center;
position:relative;
width:311px;
height:161px;
z-index:1;
text-align: right;
}
#cab_login {
float:center;
position:relative;
width:310px;
height:24px;
text-align: center;
font-weight: bold;
}
#cm_logar {
float:center;
left:100px;
position:relative;
width:96px;
height:24px;
text-align: center;
} text-align: center;
}</style>
<body>
<div id="page" align="center">
<div id="content" style="width:800px" >
<div id="logo">
<div style="margin-top:70px" class="whitetitle"></div>
</div>
<div id="topheader">
<div align="left" class="bodytext">
<br />
<strong></strong><br />
<br />
<br />
Phone: 432-653-3121<br />
</div>
<div id="toplinks" class="smallgraytext">
<a href="login.php">Login</a> | <a href="#">Sitemap</a> | <a href="#">Fale Conosco</a>
</div>
</div>
<div id="menu2">
<div align="right" class="smallwhitetext" style="padding:9px;">
<a href="#">Home</a> | <a href="#">Sobre...</a> | <a href="#">Produtos</a> | <a href="#">Nossos Serviços</a> | <a href="#">Fale Conosco</a>
</div>
</div>
<div id="submenu">
<div align="right" class="smallgraytext" style="padding:9px;">
<a href="#">Submenu 1</a> | <a href="#">Submenu 2</a> | <a href="#">Submenu 3</a> | <a href="#">Submenu 4</a> | <a href="#">Submenu 5</a> | <a href="#">Submenu 6</a>
</div>
</div><div class="bodytext" style="padding:12px;"><link rel='stylesheet' type='text/css' href='css/conteudo.css' />
<div id='conteudo'>
<div align='center'>
<form id="form1" name="form1" method="post" action="senha.php">
<div id="cab_login">Login</div>
<div id="menu_login">
<table width="310" height="161" border="0">
<tr>
<td width="142" height="50">Usuario:</td>
<td width="158"><input name="usuario" type="text" id="usuario" size="20" /></td>
</tr>
<tr>
<td width="142" height="50">Senha:</td>
<td width="158"><input name="senha" type="password" id="senha" size="20" maxlength="10" /></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
</table>
<div id="cm_logar"><input type="submit" name="submit" id="submit" value="Logar" /></div>
</div>
</form></div></div></div><div id="footer" class="smallgraytext" align="center">
<a href="#">Home</a> | <a href="#">Sobre...</a> | <a href="#">Produtos</a> | <a href="#">Nossos Serviços</a> | <a href="#">Fale Conosco</a>
|
© 2010 | <a href="[http://www.winkhosting.com"](http://www.winkhosting.com) target="_blank">Hosting</a>
</div></body></html>style.css/ CSS Document /
/PAGE LAYOUT/
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
#logo{
float:left;
background-image:url(/Sistema/img/tie_logo.gif);
width:274px;
height:213px;
}
#topheader{
float:right;
width:526px;
height:97px;
background-color:#F0F0F0;
position:relative
}
#toplinks{
position:absolute;
right:10px;
top:10px;
}
#menu2{
float:right;
width:526px;
height:32px;
background-image:url(/Sistema/img/bg_menu.gif);
background-repeat:repeat-x;
}
#submenu{
float:right;
width:526px;
height:32px;
background-image:url(/Sistema/img/bg_submenu.gif);
background-position:top;
background-repeat:repeat-x;
}
#contenttext{
float:right;
width:526px;
margin-bottom:100px;
}
#leftpanel{
float:left;
width:274px;
position:relative;
margin-left: -60px;
margin-right: 20px;
}
#footer{
float:left;
width:800px;
background-color:#F0F0F0;
padding:10px;
}/GRAY PANEL/
.graypanel{
border:solid 1px #666666; background-color:#F7F7F7; padding:10px; margin:10px;
}/TEXT STYLES/
.bodytext {
font: 11px sans-serif;
color: #666666;
}
.titletext {
font: 0.7em Tahoma, sans-serif;
font-size:36px;
font-weight:bold;
color:#CC0000;
}
.whitetitle {
font: 0.7em Tahoma, sans-serif;
font-size:36px;
font-weight:bold;
color:#FFFFFF;
}
.smalltitle {
font: 0.7em Tahoma, sans-serif;
font-size:20px;
font-weight:bold;
color:#CC0000;
}
.smallwhitetext {
font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color: #FFFFFF;
} font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color: #FFFFFF;
text-decoration:none;
} text-decoration:underline;
}
.smallgraytext {
font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color:#999999;
} font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color:#999999;
text-decoration:none;
} text-decoration:underline;
}
.smallredtext {
font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color:#CC0000;
} font: 0.7em Tahoma, sans-serif;
font-size: 11px;
font-weight:bold;
color:#CC0000;
text-decoration:none;
}Validar CSS: http://jigsaw.w3.org/css-validator/
Validar HTML: http://validator.w3.org/
Good luck http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Uma dica é começar validando seu html e css
poste um link para o site para sabermos o que esta ocorrendo