[CSS/Opera]DIV verschuift indien laatste tag=H2

[sjaakaq]

Ik heb een pagina die draait op de volgende CSS:

Cascading Stylesheet:

html
{
overflow: hidden;
}

body
{
text-align: center;
background-color: #99aaaa;
margin: 0px;
padding: 0px;
overflow: hidden;
}

#container
{
margin-left: auto;
margin-right: auto;
width: 500px;
text-align:left;
}

#header
{
width: 500px;
height:100px;
background-image: url("header.jpg");
background-position: center; 
margin: 0 0 0 0;
padding: 0 0 0 0;
}

#contentcontainer
{ 
width: 360px;
height: 400px;
background-color: #ffffff;
margin: 0 0 0 0;
padding: 0 0 0 0;
position: relative; left: 70px;
}

#footer
{ 
width:500px;
height: 79px;
background-image: url("footer.jpg");
background-position: center; 
margin: 0 0 0 0;
padding: 0 0 0 0;
}

#shadowleft
{ 
width: 70px;
height: 400px;
background-image: url("shadow_left.jpg");
margin: 0 0 0 0;
padding: 0 0 0 0;
position: relative; top: -479px;
}

#shadowright
{ 
width: 70px;
height: 400px;
background-image: url("shadow_right.jpg");
margin: 0 0 0 0;
padding: 0 0 0 0;
position: relative; top: -879px; left: 430px;
}

#content
{
width: 332px;
height: 390px;
background-color: #ffffff;
margin: 0 0 0 0;
padding-left: 14px;
padding-right: 14px;
padding-top: 10px;
padding-bottom: 0px;
font-family: Georgia;
font-size: 14px;
color: #3c3c3c;
overflow: hidden;
}

h1
{
font-family: Century Gothic;
font-size: 24px;
margin-left: 0;
margin-top: 10px;
margin-bottom: 5px;
color: #dd0000;
}

h2
{
font-family: Arial;
font-size: 9px;
text-align: right;
margin-left: 0;
margin-top: 3px;
margin-bottom: 7px;
color: #b8b8b8;
}

p
{
margin-left: 10px;
margin-top: 0;
margin-bottom: 0;
margin-right: 0;
}

Ik heb 2 HTML pagina's:
http://members.home.nl/leokennis/mijnogen/index.html
http://members.home.nl/leokennis/mijnogen/index2.html

Het enige verschil tussen de 2 is dat er in index2 onderaan "lala" staat.

In IE en FireFox zien de 2 pagina's er dan ook hetzelfde uit, op de "lala" na dan

In Opera echter, is alleeen index2.html goed. In index1.html, is de DIV "content" (waar de tekst in staat), 7px naar beneden geschoten.

Het probleem is namelijk, dat dit gebeurd als de laatste tag die je binnen een DIV gebruikt "H2" is en de pagina daarna ophoud. En dus niet als je er nog "lala" achter typt.

Nu heb ik bij H2 de bottom-margin op 7px gezet, wat die 7px verschuiving verklaard. Echter, dit zou toch niet moeten gebeuren? Iemand een oplossing? Want het staat natuurlijk nogal stom als je steeds "lala" onder iedere pagina moet typen

[Verwijderd]

alvast een oplossing, niet echt mooi maar het werkt wel:
ipv lala zet je er gewoon & nbsp ; ( <= zonder spaties) neer

[MBV]

geen H2 gebruiken? zo te zien staat er informatie die weinig met een header te maken heeft, die je dus <div class="stats"> zou kunnen noemen. Lijkt mij een nette oplossing voor het probleem, omdat je dan een zinvolle omschrijving in je CSS hebt. H2 is iets voor de volgende structuur:
<H1>1 titel </H1>
<H2>1.1 subtitel 1</H2>
blaat
<H2>...

Opmaak van structuur scheiden dus....

[sjaakaq]

Maar...hoe gebruik je dat dan?

<h1>kopje</h1>
<p>inhoud enzo lalalalalala</p>
<stats>En hier de stats</stats>

??

BTW, en das natuurlijk nog niet echt een oplossing hè

[MBV]

Het is een oplossing voor je probleem

code:

<h1>kopje</h1>
<p inhoud lalalal </p>
<div class="stats"> tijd datum enz </div>

met xhtml zou het volgens mij moeten werken met <stats>, maar ik heb dat zelf nog nooit uitgeprobeerd. Geen zin om het nu op te zoeken

[ Voor 46% gewijzigd door MBV op 26-09-2004 22:43 ]

[Verwijderd]

Hier in Opera 7.54 (super goede versie) heeft geen probleme met de index1 zowel index 2.

Gewoon even de opera browser updaten. Bij de 7.54 ben ik nog geen één bug tegen gekomen . Terwijl bij de vorige versie's elktijd wel wat mis was.

[ Voor 10% gewijzigd door Verwijderd op 26-09-2004 22:48 ]

[sjaakaq]

Verwijderd schreef op 26 september 2004 @ 22:46:
Hier in Opera 7.54 (super goede versie) heeft geen probleme met de index1 zowel index 2.

Gewoon even de opera browser updaten. Bij de 7.54 ben ik nog geen één bug tegen gekomen . Terwijl bij de vorige versie's elktijd wel wat mis was.

Ik heb em gedwonload; nog steeds hoor. De pagina werkt natuurlijk wel, maar je ziet dat de schaduw onderbroken wordt door de div-verschuiving

[Verwijderd]

dank zou je tog echt mijn oplossing moeten gebruiken

[ Voor 5% gewijzigd door Verwijderd op 27-09-2004 15:55 ]

[sjaakaq]

Tja alleen....die werkt niet

[Verwijderd]

hmm "lala" wordt tog hetzelfde gezien als nbsp...
bij mij werkt het namelijk perfect in opera 7.54

[sjaakaq]

Opgelost door er een image onder te pleuren van een 1x1 transparant GIF je.

Beetje vuil maar ok