Wed, 2005-03-02 21:02
Hi!
I´m having some troubles with my layour in both browsers. Could anyone give me a help?
What is happning in IE:
In one of the DIV´s the image is being hidden by the div above.
What is happening in FF:
If you resize FF´s screen, some div´s stay "floating"...
The code:
Quote:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<TITLE>Alex Cirnon 2005</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT=" Núcleo Livre">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
body {
font: 11px Arial;
background: #000;
color: #fff;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
margin-right: 0px;
}
#topo {
background: #1d5161 scroll;
border: 0 0 0 0;
height: 68px;
background-image: url("img/bgtopo.jpg");
background-repeat: no-repeat;
}
#meio {
background: #1d5161 scroll;
border: 0 0 0 0;
height: 345px;
background-image: url("img/bgmeio.jpg");
background-repeat: no-repeat;
}
#noticias {
background: #000 fixed;
border: 0 0 0 0;
height: 128px;
background-image: url("img/informacoes.jpg")
background-repeat: no-repeat;
}
#rodape {
background: #1d5161;
border: 0 0 0 0;
height: 102px;
background-image: url("img/bgrodape.jpg");
background-repeat: repeat-x;
}
div#content {
border: 0 0 0 0;
width: 275px;
height: 275px;
margin-left: 535px;
text-align: right;
height: 125px;
padding: 0 0 0 0;
background: transparent;
}
/*ie bugfix*/
html>body .content {
width: 600px;
}
#albumfotos {
background: #000;
background-image: url("img/bgmeioinf.jpg");
background-repeat: no-repeat;
height: 75px;
border-bottom: 1px solid #D4DBCB;
}
.form {
font-family: arial;
font-size: 11px;
color: #fff;
text-decoration: none;
background-color: #1d5161;
border: 1px solid #fff;
padding-left: 3px;
}
div#logonl {
background: transparent;
height: 50px;
width: 45px;
margin-left: 700px;
}
/*ie bugfix*/
html>body .logonl {
width:60px;
}
div#noticias_texto {
background: transparent;
height: 63px;
width: 371px;
}
div#fotos {
background: transparent;
height: 86px;
width: 300px;
margin-left: 498px;
margin-top: -35px;
text-align: left;
}
div#agendashows {
border: 2px dotted #fff;
overflow: auto;
width: 275;
height: 125px;
background-color: #1E5162 ;
filter: alpha(opacity=80);
-moz-opacity:.80;
opacity:.80;
text-align: right;
position: relative:
top: -159px;
}
</style>
</HEAD>
<BODY bgcolor="000">
<div id="topo"></div>
<div id="meio">
<div id="content"><img alt=" " src="img/mail.gif" align="right">
<br><br>
<p align="right">
<strong>Receba novidades e notÃcias em seu e-mail.</strong>
</p>
<p align="right">
Nome: <input type="text" name="nome" size="15" class="form">
</p>
<p align="right">
E-mail: <input type="text" name="email" size="15" class="form">
</p>
Cadastrar
<p>
<img alt="o que é isso? " src="img/agenda.gif"><br><strong>Agenda de
Shows</strong>
<div id="agendashows">
<p class="opaco">
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
<br><br>
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
</p>
<p>
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
<br><br>
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
</p><p>
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
<br><br>
Nesta Sexta-Feira Alex toca as melhores da MPB na Núcleo Music, a
partir das 21:hrs.
</p>
</div></div></div>
<div id="albumfotos">
<div id="fotos"><img alt=" " src="img/repertorio.gif" align="right">
<br>
<p align="right"><strong>Repertório</strong>
</p>
Texto vai aqui: existe um "br" entre a imagem e o texto. Texto
alinhado a esquerda.
</div>
</div>
<div id="noticias"><img alt=" " src="img/noticias.gif">
<br>
<strong>NotÃcias</strong>
<p>
<div id="noticias_texto">Aqui vai um texto</div>
</div>
<div id="rodape">
<div id="logonl"><a href="http://www.nucleolivre.com.br"
target="_blank"><img alt=" " src="img/logonl.jpg"
border="0"></a></div>
</div>
</BODY>
</HTML>
[bold]for those who didnt understand me[/bold]:
screen shots!
-> firefox
-> ie
-> how it should be displayied in IE (ff screenshot)
*****************
thanks!!
