|
|
 | Fejl på side i IE med CSS samt Javascript
Fra : Christian Kragh |
Dato : 18-10-10 17:15 |
|
Hej.
Jeg har følgende side under udvikling...
http://www.ugb.dk/faq.aspx
Den opfører sig lidt underligt når man klikker på "Luk svaret"
efter man har vise de enkelte Faq's.
Denne fejl er kun i IE, ikke i FF ect., men hvis man trykket på
ctrl + a så vises siden igen rigtigt igen.
Nogle ideer til at løse dette problem?
Christian
--
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
| |
 Birger Sørensen (18-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 18-10-10 17:48 |
|
Christian Kragh skrev den 18-10-2010:
> Hej.
>
> Jeg har følgende side under udvikling...
> http://www.ugb.dk/faq.aspx
>
> Den opfører sig lidt underligt når man klikker på "Luk svaret"
> efter man har vise de enkelte Faq's.
>
> Denne fejl er kun i IE, ikke i FF ect., men hvis man trykket på
> ctrl + a så vises siden igen rigtigt igen.
>
> Nogle ideer til at løse dette problem?
>
> Christian
Der er små forskelle på js i forskellige browsere.
I din kode står:
"
<div id='valid'><a href=" http://validator.w3.org/check?uri=referer"
title="This site validates against the W3C guidelines for valid XHTML
and CSS">Valid XHTML</a></div>
"
Det finder jeg pinligt, når det ikke er rigtigt...
Du har mindst een id der er ulovlig - måske er det også derfor IE kløjs
i den (ser nu ikke ud til at have noget med den at gøre).
Så vidt jeg lige kan se, handler det om en tom linie der "bliver væk" i
IE.
Koden der skjuler svaret er ikke js men JQuery. Så vi må have nogen af
dem der har forstand på det, på banen.
script bør i øvrigt stå i <head> og ikke i <body>, hvis det ikke står i
<body> fordi det skriver direkte i dokumentet - specielt hvis man
skriver XHTML, og reklamerer med det.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Christian Kragh (18-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 18-10-10 18:21 |
|
> I din kode står:
> "
> <div id='valid'><a href=" http://validator.w3.org/check?uri=referer"
> title="This site validates against the W3C guidelines for valid XHTML
> and CSS">Valid XHTML</a></div>
> "
> Det finder jeg pinligt, når det ikke er rigtigt...
> Du har mindst een id der er ulovlig - måske er det også derfor IE kløjs
> i den (ser nu ikke ud til at have noget med den at gøre).
Hvilken ID da der ikke kommer nogle fejl når jeg validere...
Christian
--
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
| |
 Birger Sørensen (18-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 18-10-10 18:29 |
|
Christian Kragh formulerede spørgsmålet:
>> I din kode står:
>> "
>> <div id='valid'><a href=" http://validator.w3.org/check?uri=referer"
>> title="This site validates against the W3C guidelines for valid XHTML
>> and CSS">Valid XHTML</a></div>
>> "
>> Det finder jeg pinligt, når det ikke er rigtigt...
>> Du har mindst een id der er ulovlig - måske er det også derfor IE kløjs
>> i den (ser nu ikke ud til at have noget med den at gøre).
>
> Hvilken ID da der ikke kommer nogle fejl når jeg validere...
>
> Christian
SGML parseren der er i HTML-validatoren til FF finder den, men den
optræder kun som en advarsel. Jeg syntes egentlig også W3C's burde
finde den.
I HTML og XHTML *skal* name og id starte med et bogstav (a-z,A-Z),
derefter vilkårlige karaktere (næsten se
http://www.w3.org/TR/html401/types.html#type-name ).
Du har en input hvor både id og name starter med 2 underscores. i en
div allerførst i dokumentet (linie 14).
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Christian Kragh (19-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 19-10-10 07:59 |
|
> SGML parseren der er i HTML-validatoren til FF finder den, men den
> optræder kun som en advarsel. Jeg syntes egentlig også W3C's burde
> finde den.
> I HTML og XHTML *skal* name og id starte med et bogstav (a-z,A-Z),
> derefter vilkårlige karaktere (næsten se
> http://www.w3.org/TR/html401/types.html#type-name ).
> Du har en input hvor både id og name starter med 2 underscores. i en
> div allerførst i dokumentet (linie 14).
Det er automatisk genereret af asp.Net så det kan jeg ikke pille ved...
Men ang. spørgsmålet hvad kan man gøre ved det der IE problem?...
Fjerne clearfix samt sætte den igen hver gang der er lukket et element?
Christian
--
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
| |
Birger Sørensen (19-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 19-10-10 08:46 |
|
Christian Kragh har bragt dette til verden:
>> SGML parseren der er i HTML-validatoren til FF finder den, men den
>> optræder kun som en advarsel. Jeg syntes egentlig også W3C's burde
>> finde den.
>> I HTML og XHTML *skal* name og id starte med et bogstav (a-z,A-Z),
>> derefter vilkårlige karaktere (næsten se
>> http://www.w3.org/TR/html401/types.html#type-name ).
>
>> Du har en input hvor både id og name starter med 2 underscores. i en
>> div allerførst i dokumentet (linie 14).
>
> Det er automatisk genereret af asp.Net så det kan jeg ikke pille ved...
>
> Men ang. spørgsmålet hvad kan man gøre ved det der IE problem?...
> Fjerne clearfix samt sætte den igen hver gang der er lukket et element?
>
> Christian
At det er asp.Net der genererer fejlen, er vel ligegyldigt. Det er
stadig en advarsel, hvorfor det er forkert at reklamere med "valid
XHTML".
Det er også stadigvæk forkert at have <script> tag midt i html'en,
selvom det virker og ikke giver fejl. Script hører til i <head>, hvis
det ikke skriver direkte i dokumentet - og det gør dit vist ikke.
Du bruger JQuery til at skjule/vise nogle elementer. Jeg kender ikke
JQuery. Men det kan gøres simpelt med nogle få liniers helt almindelig
js. Andre må fortælle om det er JQueryen der giver problemer.
Du kan prøve at sætte
clear : both;
på #sitemaplink. Det er den der farer op, og ikke respekterer de øvrige
elementter. (Den burde vist lægge sig over dem, men den lægger sig
bagved. Formentlig manipuleret med z-index, hvilket vist ikke skulle
være nødvendigt.)
Nederst i #content har du en div der har klasse clearfix (som jeg ikke
har kunnet finde i din css), den indeholder en ul som har float:right
- den er udenfor skærmen, og efter "clearfix". Jeg vil tro det er
derfor der er problemer.
Der bør i hvert element, der indeholder elementer der er floatede, være
en clear:both; til sidst. Man kan godt bruge andre elementer til det -
men de kan ikke indeholde floatede elementer, så.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Jens Peter Karlsen (19-10-2010)
| Kommentar
Fra : Jens Peter Karlsen |
Dato : 19-10-10 21:18 |
|
Når der kun er advarsler siger validatoren at man må reklamere med
valid xhtml.
Jeg validerede forleden en side i strict xhtml med en advarsel og den
sagde at jeg kunne reklamere med det.
Regards Jens Peter Karlsen.
On Tue, 19 Oct 2010 09:46:20 +0200, Birger Sørensen
<sdc@bbsorensen.com> wrote:
>At det er asp.Net der genererer fejlen, er vel ligegyldigt. Det er
>stadig en advarsel, hvorfor det er forkert at reklamere med "valid
>XHTML".
| |
Christian Kragh (20-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 20-10-10 21:39 |
|
> Men ang. spørgsmålet hvad kan man gøre ved det der IE problem?...
> Fjerne clearfix samt sætte den igen hver gang der er lukket et element?
>
> Christian
Det har ikke hjulpet det fjerneste at fjerne clearfix samt sætte den igen...
Christian
| |
Birger Sørensen (20-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 20-10-10 23:13 |
|
Christian Kragh kom med følgende:
>> Men ang. spørgsmålet hvad kan man gøre ved det der IE problem?...
>> Fjerne clearfix samt sætte den igen hver gang der er lukket et element?
>>
>> Christian
>
> Det har ikke hjulpet det fjerneste at fjerne clearfix samt sætte den igen...
>
> Christian
Prøv måske at sætte dem de rigtige steder i stedet...
hvert elemet der *indeholder* floatede elementer, skal *afsluttes* med
et element der clearer. Ellers omfatter de ikke nødvendigvis alle de
elementer de indeholder.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Jens Peter Karlsen (21-10-2010)
| Kommentar
Fra : Jens Peter Karlsen |
Dato : 21-10-10 10:39 |
|
Ikke nødvendigvis.
Du kan sagtens have 3 billeder efter hinanden der er left (eller
right) floated uden clear for hver af dem. Ligger de desuden i en
container uden øvrigt indhold kan det helt udelades. Man SKAL kun
cleare hvis der kommer indhold efter det floatede der ikke selv har en
float sat.
Regards Jens Peter Karlsen.
On Thu, 21 Oct 2010 00:12:48 +0200, Birger Sørensen
<sdc@bbsorensen.com> wrote:
>hvert elemet der *indeholder* floatede elementer, skal *afsluttes* med
>et element der clearer. Ellers omfatter de ikke nødvendigvis alle de
>elementer de indeholder.
| |
Birger Sørensen (21-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 21-10-10 10:57 |
|
Jens Peter Karlsen har bragt dette til os:
> Ikke nødvendigvis.
> Du kan sagtens have 3 billeder efter hinanden der er left (eller
> right) floated uden clear for hver af dem. Ligger de desuden i en
> container uden øvrigt indhold kan det helt udelades. Man SKAL kun
> cleare hvis der kommer indhold efter det floatede der ikke selv har en
> float sat.
>
> Regards Jens Peter Karlsen.
>
> On Thu, 21 Oct 2010 00:12:48 +0200, Birger Sørensen
> <sdc@bbsorensen.com> wrote:
>
>> hvert elemet der *indeholder* floatede elementer, skal *afsluttes* med
>> et element der clearer. Ellers omfatter de ikke nødvendigvis alle de
>> elementer de indeholder.
Det element der indeholder de floatede elementer omslutter ikke de
floatede, hvis der ikke er en clear.
Så hvis det element har indflydelse på layoutet, bliver layoutet
forkert.
Og det ser for mig ud somom det er det, der er problemet i dette
tilfælde.
Der er masser af tilfælde hvor man ikke *behøver* cleare. At remse dem
op, hjælper næppe på løsningen af problemet.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Christian Kragh (21-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 21-10-10 13:17 |
|
>> hvert elemet der *indeholder* floatede elementer, skal *afsluttes* med et
>> element der clearer. Ellers omfatter de ikke nødvendigvis alle de
>> elementer de indeholder.
>
> Det element der indeholder de floatede elementer omslutter ikke de
> floatede, hvis der ikke er en clear.
> Så hvis det element har indflydelse på layoutet, bliver layoutet forkert.
> Og det ser for mig ud somom det er det, der er problemet i dette tilfælde.
Så jeg burde sætte en clear right på menuen da det er der problemet kommer
fra?
Sådan forstår jeg denne løsning, er det rigtigt opfattet?
Christian
| |
Birger Sørensen (21-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 21-10-10 16:04 |
|
Christian Kragh forklarede den 21-10-2010:
>>> hvert elemet der *indeholder* floatede elementer, skal *afsluttes* med et
>>> element der clearer. Ellers omfatter de ikke nødvendigvis alle de
>>> elementer de indeholder.
>>
>> Det element der indeholder de floatede elementer omslutter ikke de
>> floatede, hvis der ikke er en clear.
>> Så hvis det element har indflydelse på layoutet, bliver layoutet forkert.
>> Og det ser for mig ud somom det er det, der er problemet i dette tilfælde.
>
> Så jeg burde sætte en clear right på menuen da det er der problemet kommer
> fra?
>
> Sådan forstår jeg denne løsning, er det rigtigt opfattet?
>
> Christian
Nej. Menuen er floated til venstre (endda med 2 forskellige dfinitioner
i css). Så det er det element der indeholder menuen, der skal cleares.
Men der er flere ting der svjks ikke "flyder" rigtigt i dit design, og
der er flere steder der ikke er clearet (#content, #bc, #coll clearfix,
....).
Jeg har svært ved at gennemskue dit design - du blander forskellige
teknikker - du starter med at floate menuen, og giver efterfølgende
elementer en margin for at gøre plads til den. Du begynder altså med
noget float - men det ser ikke ud somom du gennemfører det.
Og midt i det hele står så <script> tags, som ikke hører til der - og
der røg mit overblik.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Christian Kragh (22-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 22-10-10 21:29 |
|
> > Så jeg burde sætte en clear right på menuen da det er der problemet
> > kommer fra?
> > Sådan forstår jeg denne løsning, er det rigtigt opfattet?
> > Christian
> Nej. Menuen er floated til venstre (endda med 2 forskellige dfinitioner i
> css). Så det er det element der indeholder menuen, der skal cleares.
> Men der er flere ting der svjks ikke "flyder" rigtigt i dit design, og der
> er flere steder der ikke er clearet (#content, #bc, #coll clearfix, ...).
Jeg er lidt, faktisk rigtig meget, ikke med på hvad du mener...
Hvis jeg taget et element og har en float:left; så skal jeg vel i elementet
efter have en clear:both;
Det er vel ikke det element der er overordnet det floatede element.
> Jeg har svært ved at gennemskue dit design - du blander forskellige
> teknikker - du starter med at floate menuen, og giver efterfølgende
> elementer en margin for at gøre plads til den. Du begynder altså med noget
> float - men det ser ikke ud somom du gennemfører det.
> Og midt i det hele står så <script> tags, som ikke hører til der - og der
> røg mit overblik.
Har lagt en html side her: http://www.ugb.dk/test.htm med designet
forsimplet...
Desuden har jeg løst problemet med at fravælge slidedown og slideup.
Jeg har valgt at vise og skjule elementerne med faq ved at skrive følgende:
$(this).parents('dt').next('dd').css("display", "block");
$(this).parents('dt').next('dd').css("display", "none");
Altså rent css element der tilføjes...
Christian
| |
Birger Sørensen (22-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 22-10-10 23:08 |
|
Den 22-10-2010, skrev Christian Kragh:
>> > Så jeg burde sætte en clear right på menuen da det er der problemet
>> kommer fra?
>> > Sådan forstår jeg denne løsning, er det rigtigt opfattet?
>> > Christian
>> Nej. Menuen er floated til venstre (endda med 2 forskellige dfinitioner i
>> css). Så det er det element der indeholder menuen, der skal cleares.
>> Men der er flere ting der svjks ikke "flyder" rigtigt i dit design, og der
>> er flere steder der ikke er clearet (#content, #bc, #coll clearfix, ...).
> Jeg er lidt, faktisk rigtig meget, ikke med på hvad du mener...
> Hvis jeg taget et element og har en float:left; så skal jeg vel i elementet
> efter have en clear:both;
> Det er vel ikke det element der er overordnet det floatede element.
F.eks.:
<div>
<div float:left>
<img float:left>
<p float:left>
<div clear>
Det element der clearer, skal indeholdes af det samme element der
indeholder de floatede elementer, og stå efter dem.
Når du har
<div>
<menu float:left>
men undlader at cleare i det element der indeholder menuen (her div),
vil div'en ikke tage størrelse efter menuen, men efter andet indhold.
Efterfølgende elementer vil derfor kunne rulle op bag menuen - hvilket
for mig ser ud til at være det der sker.
>
>> Jeg har svært ved at gennemskue dit design - du blander forskellige
>> teknikker - du starter med at floate menuen, og giver efterfølgende
>> elementer en margin for at gøre plads til den. Du begynder altså med noget
>> float - men det ser ikke ud somom du gennemfører det.
>> Og midt i det hele står så <script> tags, som ikke hører til der - og der
>> røg mit overblik.
>
> Har lagt en html side her: http://www.ugb.dk/test.htm med designet
> forsimplet...
>
> Desuden har jeg løst problemet med at fravælge slidedown og slideup.
> Jeg har valgt at vise og skjule elementerne med faq ved at skrive følgende:
> $(this).parents('dt').next('dd').css("display", "block");
> $(this).parents('dt').next('dd').css("display", "none");
> Altså rent css element der tilføjes...
Til manipulering af elementers css, er JQuery overkill.
Det kan gøres med helt almindeligt javascript. Så kan du spare 32Kb
JQuery..
Mener for øvrigt også at slideup og slidedown kan udføres med simple
css manipulationer af clip eller højde på elementet.
>
> Christian
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Christian Kragh (23-10-2010)
| Kommentar
Fra : Christian Kragh |
Dato : 23-10-10 12:11 |
|
> Når du har
> <div>
> <menu float:left>
> men undlader at cleare i det element der indeholder menuen (her div), vil
> div'en ikke tage størrelse efter menuen, men efter andet indhold.
> Efterfølgende elementer vil derfor kunne rulle op bag menuen - hvilket for
> mig ser ud til at være det der sker.
Super...
Det prøver jeg at rette...
> Til manipulering af elementers css, er JQuery overkill.
> Det kan gøres med helt almindeligt javascript. Så kan du spare 32Kb
> JQuery..
> Mener for øvrigt også at slideup og slidedown kan udføres med simple css
> manipulationer af clip eller højde på elementet.
Bruger jquery til fotoalbummet her:
http://www.ugb.dk/albums/album.aspx
Så det er alligevel hentet...
Christian
| |
Birger Sørensen (23-10-2010)
| Kommentar
Fra : Birger Sørensen |
Dato : 23-10-10 13:02 |
|
Christian Kragh:
> Bruger jquery til fotoalbummet her:
> http://www.ugb.dk/albums/album.aspx
>
> Så det er alligevel hentet...
Altså bare fordi...
At man bruger JQuery til at vise billeder, er vel ikke en begrundelse
for at hente JQuery til sider hvor man ikke skal vise billeder?
Fordi forsiden validerer sætter vi en "Valid XHTML" reklame på alle
siderne. Det bliver det bare ikke rigtigt af...
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
|
|