Notifikationer

Markér alle som læst Log ud

c-sharp Nybegynder

20. februar 2008 - 14:07 Der er 13 kommentarer

Tekst bliver grim i IE7 når det sættes til position: absolute

Den øverste tekst i det nedenstående eksempel bliver grimi IE7, Hvad kan jeg gøre for at undgå det?

<!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" >
<head runat="server">
<title>Untitled Page</title>

<style type="text/css">
h3
{
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#046380;
font-size:14px;
font-weight:bold;
}

#minDiv
{
position: absolute;
filter: alpha(opacity=100);
-moz-opacity: 100;
}
</style>
</head>
<body >
<form id="form1" runat="server">
<div>
<h3 id="minDiv" style="">Dette er en test</h3>
<br /><h3>Dette er en test</h3>
</div>
</form>
</body>
</html>

Synes godt om

krogstrup Nybegynder

20. februar 2008 - 14:27 #1

prøv at fjerne opacity=100
jeg har tidligere oplevet at teksten bliver grumset i IE når opacity er sat til 100

Synes godt om

c-sharp Nybegynder

20. februar 2008 - 14:52 #2

Hej Krogstrup og tak for din kommentar!

Jeg har brug for opacity for teksten skal fade ud og ind, postede bare et simple eksemple for ikke at forvirre :)

Synes godt om

krogstrup Nybegynder

20. februar 2008 - 14:59 #3

men har du prøvet at eksperimentere med om det rent faktisk er opacity der gir dig problemer ?

Synes godt om

c-sharp Nybegynder

20. februar 2008 - 17:00 #4

Det er en kombination af opacity og position: absolute. Nogen mener at det hjælper at sætte en background-color, men det kan jeg ikke se at det hjælper i ovenstående.

Synes godt om

olebole Juniormester

20. februar 2008 - 17:39 #5

<ole>

Umiddelbart ser det f.eks. ikke ud til, at du bruger absolut positionering til andet end at sikre, elementet har 'hasLayout' - og i så fald er der jo andre muligheder. Hvad bruger du positioneringen til?

I det hele taget ville det være rart at kunne se den aktuelle kode, så det er muligt at komme med realistiske alternativer ;o)

/mvh
</bole>

Synes godt om

c-sharp Nybegynder

20. februar 2008 - 20:43 #6

Så kommer der lige lidt mere kode, så håber jeg at det hele giver mening:

<!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" >
<head>
<title>Untitled Page</title>

<style type="text/css">
h3
{
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#046380;
font-size:14px;
font-weight:bold;
}

#minDiv
{
position: absolute;
filter: alpha(opacity=100);
-moz-opacity: 100;
}
</style>
</head>
<body >
<form id="form1">
<div>
<h3 id="minDiv" style="">Dette er en test</h3>
<br /><h3>Dette er en test</h3>
</div>

<script type="text/javascript">

window.onload=function()
{
fadeind('minDiv',0);
}

function fadeind(element, opac) {
if (opac <= 100) {
obj = document.getElementById(element);
if (document.all)
obj.filters.alpha.opacity = opac;
else
obj.style.MozOpacity = opac / 100;
opac += 5;
setTimeout("fadeind('" + element + "', " + opac + ");", 50);
}
else
setTimeout("fadeud('" + element + "', " + opac + ");", 50);
}

function fadeud(element, opac) {
if (opac >= 0) {
obj = document.getElementById(element);
if (document.all)
obj.filters.alpha.opacity = opac;
else
obj.style.MozOpacity = opac / 100;
opac -= 5;
setTimeout("fadeud('" + element + "', " + opac + ");", 50);
}
else
setTimeout("fadeind('" + element + "', " + opac + ");", 50);
}
</script>
</form>
</body>
</html>

Synes godt om

olebole Juniormester

20. februar 2008 - 21:29 #7

Er du sikker på, det er helt præcist sådan koden i dit dokument ser ud?

Synes godt om

c-sharp Nybegynder

21. februar 2008 - 08:07 #8

Hej igen ole og tak for din tid!

Kan du ikke se problemet i mit eksempel? det er en del nemmere at se det i mit simple eksempel end at jeg skal poste 1000 liniers kode :)

Synes godt om

olebole Juniormester

21. februar 2008 - 20:35 #9

Jo, jeg kan sagtens se problemet, men er det ikke en løsning, jeg skal få øje på? Du behøver ikke poste andet end et link :)

Synes godt om

c-sharp Nybegynder

01. april 2008 - 09:31 #10

Så fik jeg et sted at smid mit kode, du kan se det her: http://udvikling.g2t.dk

Synes godt om

olebole Juniormester

01. april 2008 - 15:58 #11

Jeg kan ikke se problemer i min IE7

Synes godt om

c-sharp Nybegynder

03. april 2008 - 08:07 #12

Jeg har nu smidt teksten som den bør se ud nederst i venstre hjørne, kan du se forskellen?

Synes godt om

c-sharp Nybegynder

09. juni 2008 - 09:09 #13

Er der mere hjælp her?

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS