/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Hjælp til dropdown menupanel i IE7
Fra : Jørgen Farum Jensen


Dato : 21-12-09 12:10

Jeg er ved at opdatere nogle artikler om dropdown-
menuer, og er rendt i et problem med visningen i
Internet Explorer 7.

http://webdesign101.dk/www/cssmenu/dropdownmenu/eks08.html
viser dropdownmenuen som højrestillet i en højrefloat'et
spalte. Den virker som forventet.

http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06.html
viser den samme menu, men nu i en venstrefloat'et spalte.
Den virker også som forventet, undtagen i IE7.

Jeg kan huske at jeg er stødt på problemet før, men kan
ikke for min død huske løsningen.

I begge tilfælde er stylesheet'et for selve menuen ind-
lejret i dokumentet. Det stylesheet, der formaterer
siden, er
http://webdesign101.dk/www/cssmenu/dropdownmenu/commonpage.css



--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

 
 
Jørgen Farum Jensen (21-12-2009)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 21-12-09 21:26

Jørgen Farum Jensen skrev:

> http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06.html
> viser den samme menu, men nu i en venstrefloat'et spalte.
> Den virker også som forventet, undtagen i IE7.

<snip- snip>
> I begge tilfælde er stylesheet'et for selve menuen ind-
> lejret i dokumentet. Det stylesheet, der formaterer
> siden, er
> http://webdesign101.dk/www/cssmenu/dropdownmenu/commonpage.css

Og det er her hunden ligger begravet:
Indtrykket af lige høje kolonner er opnået
med følgende stylesheet
div#container {overflow:hidden;}
#menucol, #indhold {
padding-bottom:12000px;
margin-bottom:-12000px;}

Hvis jeg i stedet for denne metode bruger
"Faux Column" metoden til at skabe indtryk
af lige høje kolonner er der ingen problemer,
jf.
http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06a.html

Men det er i mine øjne et tilbageskridt. Så hvis
nogen har en forklaring - eller i bedste fald et
IE7 hack - hører jeg meget meget gerne om det.
--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Erik Ginnerskov (21-12-2009)
Kommentar
Fra : Erik Ginnerskov


Dato : 21-12-09 23:09
Jørgen Farum Jensen (22-12-2009)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 22-12-09 12:00

Erik Ginnerskov skrev:
> Jørgen Farum Jensen wrote:
>
>> http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06a.html
>
> 404
>
UPS!

Det hjælper altid på tingene hvis man faktisk også
uploader de sider, man skriver om...
Repetition:
Det drejer sig om visningen af et dropdown menupanel
i Internet Explorer 7 på en side med en venstrefloatet
menuspalte:

Layout 1:
http://localhost/www/cssmenu/dropdownmenu/eks06.html
I dette eksempel forsvinder indholdet, nå musen føres
ind over menupanelet.
Indtrykket af lige høje kolonner er opnået med følgende
stylesheet:
div#container {overflow:hidden;}
#menucol, #indhold {
padding-bottom:12000px;
margin-bottom:-12000px;}
Layout 2:
http://localhost/www/cssmenu/dropdownmenu/eks06a.html
I dette eksempel er der ikke tilstræbt lige høje
kolonner. Spaltestregen er skabes af en border-left på
artikel-elementet.
Layout 3:
http://localhost/www/cssmenu/dropdownmenu/eks06b.html
I dette eksempel er de to metoder kombineret, idet
<IE7 præsenteres for layout nr. 2, mens alle andre
browsere præsenteres for layout nr. 1.

Jeg imidlertid ikke frigøre mig fra tanken om at der
må være et hack, der gør det muligt at få IE7 til at
te sig som IE8 eller andre moderne browsere som de
skal i henhold til layout 1.

Problemet opstår ved at #menucol udvides i bredden,
når en undermenu skal vises (tydeligt i web developer
til FF).
--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Kerim Ellentoft (22-12-2009)
Kommentar
Fra : Kerim Ellentoft


Dato : 22-12-09 12:10

Jørgen Farum Jensen <jfjenzen@yahoo.dk> skrev :

>Det hjælper altid på tingene hvis man faktisk også
>uploader de sider, man skriver om...
> (Snip)
>Layout 1:
>http://localhost/www/cssmenu/dropdownmenu/eks06.html
> (Snip)
>Layout 2:
>http://localhost/www/cssmenu/dropdownmenu/eks06a.html

Hvordan synes du, det går?
--
Kerim
http://www.facebook.com/kerim.ellentoft

Stig Johansen (22-12-2009)
Kommentar
Fra : Stig Johansen


Dato : 22-12-09 12:51

Kerim Ellentoft wrote:

>>Det hjælper altid på tingene hvis man faktisk også
>>uploader de sider, man skriver om...
>> (Snip)
>>Layout 1:
>>http://localhost/www/cssmenu/dropdownmenu/eks06.html
>> (Snip)
>>Layout 2:
>>http://localhost/www/cssmenu/dropdownmenu/eks06a.html
>
> Hvordan synes du, det går?

Hvad mener du med det?

Jeg kan da fint tilgå min localhost, dog ikke de sider Jørgen henviser til.

<sarkasm off> - og god jul.

--
Med venlig hilsen
Stig Johansen

Kerim Ellentoft (22-12-2009)
Kommentar
Fra : Kerim Ellentoft


Dato : 22-12-09 13:39

Stig Johansen <wopr.dk@gmaill.com> skrev :

>Jeg kan da fint tilgå min localhost, dog ikke de sider Jørgen henviser til.
>
><sarkasm off> - og god jul.

Nu holder jeg jo ikke jul, men tak for det og vil da så ogå sige
God Jul til dig.
--
Kerim
http://www.facebook.com/kerim.ellentoft

Jørgen Farum Jensen (22-12-2009)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 22-12-09 13:29

Kerim Ellentoft skrev:

> Hvordan synes du, det går?

Ik' for godt . En gang til

Repetition:
Det drejer sig om visningen af et dropdown menupanel
i Internet Explorer 7 på en side med en venstrefloatet
menuspalte:

Layout 1:
http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06.html
I dette eksempel forsvinder indholdet, nå musen føres
ind over menupanelet.
Indtrykket af lige høje kolonner er opnået med følgende
stylesheet:

div#container {overflow:hidden;}
#menucol, #indhold {
padding-bottom:12000px;
margin-bottom:-12000px;}

Layout 2:
http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06a.html
I dette eksempel er der ikke tilstræbt lige høje
kolonner. Spaltestregen er skabes af en border-left på
artikel-elementet.

Layout 3:
http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06b.html
I dette eksempel er de to metoder kombineret, idet
<IE7 præsenteres for layout nr. 2, mens alle andre
browsere præsenteres for layout nr. 1.

Jeg imidlertid ikke frigøre mig fra tanken om at der
må være et hack, der gør det muligt at få IE7 til at
te sig som IE8 eller andre moderne browsere som de
skal i henhold til layout 1.

Problemet opstår ved at #menucol udvides i bredden,
når en undermenu skal vises (tydeligt i web developer
til FF).
--
Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Erik Ginnerskov (22-12-2009)
Kommentar
Fra : Erik Ginnerskov


Dato : 22-12-09 13:50

Jørgen Farum Jensen wrote:
> Kerim Ellentoft skrev:
>
>> Hvordan synes du, det går?
>
> Ik' for godt . En gang til
>
> Repetition:
> Det drejer sig om visningen af et dropdown menupanel
> i Internet Explorer 7 på en side med en venstrefloatet
> menuspalte:

Hvis du sætter position:relative; og z-index:6; på menuen, kan den så lade
være med at skubbe det hele allerhel..... langt ned ved hover i IE 7?

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk


Jørgen Farum Jensen (22-12-2009)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 22-12-09 15:13

Erik Ginnerskov skrev:
> Jørgen Farum Jensen wrote:
>> Kerim Ellentoft skrev:
>>
>>> Hvordan synes du, det går?
>>
>> Ik' for godt . En gang til
>>
>> Repetition:
>> Det drejer sig om visningen af et dropdown menupanel
>> i Internet Explorer 7 på en side med en venstrefloatet
>> menuspalte:
>
> Hvis du sætter position:relative; og z-index:6; på menuen, kan den så
> lade være med at skubbe det hele allerhel..... langt ned ved hover i IE 7?
>

Desværre ikke.

Jeg har lige opdaget, at fejlen også opstår i IE8,
hvis man bruger kompatibilitetsknappen og dermed sætter
IE8 i IE7 modus.

Pause ---

BANG BANG BANG lyden af mit hoved der knalder ned
i skrivebordet!

Løsningen er: left-float af div#menucol ul.

Hvorfor: Siden har ingen sidefod. Derfor clear'es
container-elementet ikke. Hvad er det der skal clear'es?
#menucol. Det virker ikke. Så for sjov prøver man lige
at floate /indholdet/ af #menucol. Bingo. Det er jul,
afsted til det røde hav!

Jeg gider ikke lige nu spekulere det helt igennem.
Det kan jeg gøre ved poolkanten...

Den reviderede side er uploadet som
http://webdesign101.dk/www/cssmenu/dropdownmenu/eks06.html

Der mangler lidt afpudsning af koden, men også det får
vente til senere.

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408917
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste