---

Hej.

Jeg har et problem med IE, som jeg bare ikke kan få løst. På min
side har jeg i toppen en wrapper div (header) hvor jeg har lagt et
sidebillede i baggrunden, som starter header'en. I header'en ligger en
anden div som indeholder logo'et, som er en blanding af tekst og
billede. Efter den div har jeg slutningen på header'en - endnu et
billede.
Problemet er det første billede til venstre(baggrundsbillede i
header). I IE hopper det en smule ned i forhold til resten af
header'en. Billede er 66px høj.

Siden han ses her: http://www.kognitivc.dk/minTemplate.htm

kodeeksempel...
HTML:
<div class="header">
<div class="topbar">
<h1 class="siteName" id="firstword">Kognitivt</h1>
<h1 class="siteName">Behandlingscenter</h1>
<img class="star" alt="logo" src="Stjernen.gif" />
</div>
<img class="topimage" src="topimage1.jpg" />
</div>
CSS:
..header {
background-image: url(topbarLeft.gif); /* det er det her billede som
driller */
background-repeat: no-repeat;
background-position: left;
}
..topbar {
width: 60%;
background-image: url(topbarRight.gif);
background-repeat: no-repeat;
background-position: right;
float: left;
position: relative;
z-index: 10;
}
..header, .topbar, .topimage { height: 66px; }
..topimage {
min-width: 300px;
position: relative;
left: -45px;
z-index: 1;
}
h1.siteName {
font-family: Tahoma, Arial, "Times New Roman";
font-size: 25px;
font-weight: normal;
letter-spacing: 0.2em;
margin: 0px 43px 0px 5px;
padding: 0px 0px 0px 31px;
background-color: #99CC66;
height: 33px;
}
h1.siteName:first-letter { font-size:30px; }
h1.siteName#firstword {
padding: 0px 0px 0px 11px;
}
..star {
left: 340px;
top: 10px;
position: absolute;
}

Siden han ses her: http://www.kognitivc.dk/minTemplate.htm

Jeg har tjekket siden i FF og Opera og der virker den perfekt. Nogen
idéer??
MVH Jon

---

Jon skrev:

> Jeg har et problem med IE, som jeg bare ikke kan få løst.

[snip]

> Siden han ses her: http://www.kognitivc.dk/minTemplate.htm

Start med at validere din side. Se hvordan og hvorfor her:

<http://www.html-faq.dk/1005.asp>
<http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you>
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

skrev:

> Nope, no dice. Der lærte jeg lige hurtigt noget om nested ul i
> XHTML. Men elementet er stadigvæk forskudt i IE (som er den
> eneste browser der gør det!).

Du sætter IE i quirksmode på grund af din xml-erklæring - det er en
dårlig ide, specielt fordi andre browsere viser siden i
standardmode (se evt. <http://www.hintzmann.dk/articles/doctype/>)

Men det er dog ikke det der driller her - i hvert fald er problemet
der også hvis man fjerner xml-erklæringen.

Efter lidt nørkleri fandt jeg dog en mulig løsning:
<http://gyros.dk/usenet/temp/kognitiv.html>

Tricket er at fjerne alle mellemrum i <div class="topbar">. Det er
mellemrummene der genererer den ekstra luft i IE (muligvis kun
mellemrum før og efter <img> - det er ikke testet).

Jeg kan ikke huske om der er en alternativ mulighed for at fikse
det ved at sætte en bestemt vertical-align-værdi på img - men her
kan andre måske træde til.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

Nope, no dice. Der lærte jeg lige hurtigt noget om nested ul i XHTML.
Men elementet er stadigvæk forskudt i IE (som er den eneste browser
der gør det!).

---

Jon wrote in dk.edb.internet.webdesign.html:
> Hej.
> CSS:
> ..header {
> background-image: url(topbarLeft.gif); /* det er det her billede som
> driller */
> background-repeat: no-repeat;
> background-position: left;
> }

Hej Jon
Skriv top-left i stedet for left, så virker det...
Mvh
Jeppe

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

---

Tusind tak for hjælpen.