Imposivel desenvolver este layout!?
Olá galera!! Seguinte....nem sei masi o que tentar, ja tentei de tudo e não deu certo se alguem tiver a solução vai ser o cara ao meu ver!!!!!
este é o layout:
http://www.fohatlux.com.br/teste/layout.jpg
1 - Esse layout fica centralizado na tela.
2 - a parte onde vai o conteudo é a parte branca, esta parte branca esta dividida por uma linha pontilhada separando o conteudo do background. O conteudo fica do lado esquerdo e o que estiver do lado diretito da linha deve ser o background, onde este deve preencher de branco todo o espaço que estiver sobrando do lado direito e ainda o pior de tudo acompahnar na altura o que estiver no lado do conteudo e ai que estou apanhando.....
este é o link da estrutura:
http://www.fohatlux.com.br/teste/
codigo:
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<!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%22)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
body{
background:url(img/backpag.jpg) repeat;
color:#333;
font-family:"Trebuchet MS", Verdana, Arial, sans-serif;
font-size:12px;
margin:0;
padding:0;
height:100%;
text-align:center;
cursor:default;
}
html{
height:100%;
}
#bgright{
background:#FFF url(img/backpagright.jpg) repeat-x;
color:#333;
height:183px;
left:50%;
position:absolute;
top:0;
z-index:0;
width:50%;
}
#geral{
background:#FFF url(img/backcont.jpg) repeat-y;
color:#333;
display:table;
margin:0 auto;
padding:0;
position:relative;
text-align:left;
width:770px;
z-index:1;
height:100%;
}
#top{
margin:0;
padding:0;
width:770px;
height:183px;
background:#FFF url(img/backtop.jpg) no-repeat;
}
#menu{
margin:0;
padding:0;
width:500px;
height:36px;
float:right;
}
#logo{
margin:59px 0 0 22px;
padding:0;
width:162px;
height:69px;
position:absolute;
cursor:pointer;
background-color:#CCCCCC;
}
#ilustracao{
margin:36px 0 0 488px;
padding:0;
width:282px;
height:147px;
position:absolute;
background-color:#CCCCCC;
}
</style>
</head>
<body>
<div id="bgright"></div>
<div id="geral">
<div id="top">
<div id="logo">LOGO</div>
<div id="menu">MENU PRINCIPAL</div>
<div id="ilustracao">ILUSTRACAO DE PAGINA</div>
</div>
</div>
</body>
</html>
valeu
Att
Rafael
Discussão (4)
Carregando comentários...