[OPGELOST] IE7 / IE8 /FF Margin probleem

[brentnl]

Ook dit is weer een titel uit duizenden, maar ik kon het niet beter formuleren.
Het gaat om het volgende, ik ben bezig met deze website.

Zoals je ziet (wanneer je FF of IE8 gebruikt) wordt het menu te ver naar onderen geduwd. In ie7 geeft hij hem 'goed' weer. Ik heb de afstand in photoshop opgemeten, en dit bedraagd 107px. Ik heb het menu, welke in een div zit met de class 'menu' een margin-top meegegeven van 107px. Ik moet deze instellen op 93px wil ik het menu op de juiste plaats krijgen. Ergens zit er dus een verschil van 14px. Ik kan dit alleen niet herleiden...

Tevens heb ik een probleem met het dropdown menu in IE7. Mijn css file is een beetje rommelig, en daardoor kom ik er nu ook niet echt meer uit. Er zijn dus eigenlijk 3 manieren waarop het dropdown menu geactiveerd kan worden;
1. er is een ander menu item geselecteerd en je hovert over een menu item MET dropdown
2. er is een menu item geselecteerd welke de parent is van een dropdown menu en je hovert over die parent.
3. er is een menu item geselecteerd welke de child is van een parent, en je hovert over die parent.

nou, bij de 2e variant gaat het dus mis. Het dropdown menu zit te ver naar rechts en te hoog.. Zie onderstaand plaatje voor een verduidelijking van de 3 varianten.


De website is hier te bekijken.

[brentnl]

niemand? 

[Jos]

Zoals je ziet (wanneer je FF of IE8 gebruikt) wordt het menu te ver naar onderen geduwd. In ie7 geeft hij hem 'goed' weer.

Als FF en de nieuwste IE versie het anders doen dan IE7, dan kun je je afvragen of IE7 wel goed is...

Ergens zit er dus een verschil van 14px. Ik kan dit alleen niet herleiden...

Voor FF zijn er prachtige plugins die je hierbij kunnen helpen, zoals Firebug en Webdeveloper Toolbar. Met Firebug kun je live met je css-sheet manipuleren en zie je direct wat er verandert.

[brentnl]

Ik zou natuurlijk een aparte css file kunnen maken met alleen die eigenschap voor IE7, maar dat is meer een vies truukje.

Firebug maak ik al gebruik van, maar kon het probleem niet achterhalen. Waarschijnlijk telt IE7 iets bij elkaar op wat FF en IE8 niet doen.. als ik de website in ie8 open gaat het knopje van 'compatibiliteitsmodus'  ook 'branden', dat betekend ook niet veel goeds lijkt me..

[Rolf]

Ik zou natuurlijk een aparte css file kunnen maken met alleen die eigenschap voor IE7, maar dat is meer een vies truukje.

Hoe is dit probleem in eerste instantie ontstaan?
De standaard pull-down menu's van cmsms werken perfect in alle browsers... Zonder vieze truukjes   ;)

Grt. Rolf

[brentnl]

Ik zou natuurlijk een aparte css file kunnen maken met alleen die eigenschap voor IE7, maar dat is meer een vies truukje.

Hoe is dit probleem in eerste instantie ontstaan?
De standaard pull-down menu's van cmsms werken perfect in alle browsers... Zonder vieze truukjes   ;)

Grt. Rolf

Daar heb ik eigenlijk helemaal geen gebruik van gemaakt, ik wilde gewoon stapje voor stapje zelf een menu maken, zodat ik ook wist hoe het werkte. Dus ik heb de css zelf gemaakt en de template deels zelf, deels van andere templates..

[brentnl]

Ik heb op 1 of andere manier het 'voor elkaar gekregen' om dezelfde fout ook in firefox te creëren.

http://suredesign.nl/hofmans/ -> klik op maaltijden, en hover vervolgens daar overheen, zoals je ziet staat het dropdown menu dan verkeerd, terwijl wanneer je een sub item van 'maaltijden' aanklikt, en je dan over de parent hovert, er niets aan de hand is.

[Rolf]

ik wilde gewoon stapje voor stapje zelf een menu maken, zodat ik ook wist hoe het werkte.

We horen graag dat mensen proberen te leren door het gewoon zelf te doen, maar in dit geval zou ik de moeite niet nemen.
Door de verschillende werkingen van de beschikbare browsers blijf je soms aan de gang.
De bestaande (navigatie) templates van cmsms zijn voorzien van verschillende hacks om oude en nieuwe browser te plezieren. Het werkt gewoon... 

Grt. Rolf

[brentnl]

ik wilde gewoon stapje voor stapje zelf een menu maken, zodat ik ook wist hoe het werkte.

We horen graag dat mensen proberen te leren door het gewoon zelf te doen, maar in dit geval zou ik de moeite niet nemen.
Door de verschillende werkingen van de beschikbare browsers blijf je soms aan de gang.
De bestaande (navigatie) templates van cmsms zijn voorzien van verschillende hacks om oude en nieuwe browser te plezieren. Het werkt gewoon... 

Grt. Rolf

Jij stelt dus voor om zo'n template als uitgangspunt te nemen en daarop de css aan gaan passen?
Is dat nu niet meer werk dan wanneer ik dit ene foutje eruit probeer te halen?

[Rolf]

Jij stelt dus voor om zo'n template als uitgangspunt te nemen en daarop de css aan gaan passen?
Is dat nu niet meer werk dan wanneer ik dit ene foutje eruit probeer te halen?

Dat hoor je mij niet zeggen 
Deze afweging mag je voor deze website zelf maken. 
Maar voor een volgende...

Grt. Rolf 

[brentnl]

Jij stelt dus voor om zo'n template als uitgangspunt te nemen en daarop de css aan gaan passen?
Is dat nu niet meer werk dan wanneer ik dit ene foutje eruit probeer te halen?

Dat hoor je mij niet zeggen 
Deze afweging mag je voor deze website zelf maken. 
Maar voor een volgende...

Grt. Rolf 

haha oke, in het vervolg zal ik ook zeker gebruik maken van die templates, maar voor deze site ben ik ervan overtuigd dat iemand met meer css kennis als mij dit probleem binnen enkele minuten heeft getraceerd. Ik hoop dan ook dat er iemand is die zo gek is om mij even te helpen 

[Rolf]

maar voor deze site ben ik ervan overtuigd dat iemand met meer css kennis als mij dit probleem binnen enkele minuten heeft getraceerd. Ik hoop dan ook dat er iemand is die zo gek is om mij even te helpen

pff. dat is wel heel positief...

Weet niet of je er wat mee kunt, maar als je de Active Parent aanklikbaar ... maakt dan werkt het menu wel goed...

Grt. Rolf

[brentnl]

pff. dat is wel heel positief...

Zo was het niet bedoeld

Weet niet of je er wat mee kunt, maar als je de Active Parent aanklikbaar ... maakt dan werkt het menu wel goed...

Grt. Rolf

Je hebt gelijk.. alleen dan is de opmaak van elke currentpage weer vern**kt..  heb je het ene gefixed, moet je iets anders weer rechttrekken.. denk dat ik toch maar helemaal opnieuw ga beginnen met dit menu. Welke standaard template lijkt het meeste op mijn opstelling? css menu shadow?

[brentnl]

Ik ben dus helemaal opnieuw begonnen, met cssmenu_ulshadow.tpl als basis. Een paar dingen (zoals de seperator) heb ik eruit gesloopt. En toen ben ik stapje voor stapje met de css begonnen. Uiteindelijk werkt het menu zoals het hoort!

Rolf, bedankt dat je me op het goede spoor hebt gezet 

[Jos]

Rolf, bedankt dat je me op het goede spoor hebt gezet 

Niet om het één of ander, maar laten we dit wel even binnen de juiste kaders beschouwen. Zie onderstaande post van 30 augustus dit jaar  :P

Ik begrijp dat je vanuit je bestaande menu toe wilt werken naar de gewenste situatie. Ik vind dat niet verstandig, vooral niet als je met zoveel vragen zit.

Begin met een schone lei en probeer eerst eens je voorbeeldmenu via ModuleManager aan de praat te krijgen. Ga pas daarna de stijl naar je wens aanpassen.