anoniem Geplaatst: 19 februari 2004 Delen Geplaatst: 19 februari 2004 Ik heb een menu gemaakt met ul en li tags zoals hieronder staat: [code:1:c1bcec22b7] <div id="menu"> <ul> <li><a href="index.php">Home </a></li> <li><a href="nieuws.html">Nieuws </a></li> <li><a href="stand.html">Stand </a></li> <li><a href="wedstrijdschema.php">Wedstrijdprogramma </a></li> <li><a href="uitslagen.php?poule=D">Uitslagen </a></li> <li><a href="regels.html">Uitleg/regels </a></li> </ul> </div> [/code:1:c1bcec22b7] De CSS code daarbij is de volgende: [code:1:c1bcec22b7] #menu{ position:relative; top:0px; left:0px; /*height:200px;*/ width:190px; border:solid 10px #FF7F02; } #menu ul{ margin:0px; padding:5px; list-style-type:none; } #menu a{ background-color:#FFD37D; display:block; border:solid 1px #FF7F02; margin-bottom:1px; text-decoration:none; color:#000000; padding:3px 5px 3px 10px; } #menu a:hover, #menu a:focus, #menu a:active{ background-color:#EF9C00; display:block; } [/code:1:c1bcec22b7] Het probleem is nu dat in IE m'n eerste list item geen lay-out mee krijgt en de rest wel, de link werkt gewoon, maar zonder mooie kleurtjes. Hoe kan dit? Thnx! StruiS Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 Kan je svp een linkje plaatsen, dan kunnen we wat makkelijker kijken... Ik maak namelijk gebruik van een bookmarklet in Mozilla waardoor ik het CSS direct kan aanpassen en live de resultaten zie. - Bas Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 [url=http://www.vvmonnickendam.nl/ek2004]tada!!![/url] O enne volgens mij werkt het wel in mozilla, maar aangezien het grootste gedeelte toch IE gebruikt, is dat ook wel makkelijk Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 Er zat een aantal foutjes in, met name in [i:90cf5f24c0]border[/i:90cf5f24c0], je gebruikt een verkeerde volgorde. Kijk eens of dit werkt:[code:1:90cf5f24c0]#menu{ position: relative; top: 0; left: 0; /*height:200px;*/ width: 190px; border: 10px solid #FF7F02; } #menu ul{ margin: 0; padding: 5px; list-style-type: none; } #menu a, #menu a:link{ background-color: #FFD37D; display: block; border: 1px solid #FF7F02; margin-bottom: 1px; text-decoration: none; color: #000; padding: 3px 5px 3px 10px; } #menu a:hover, #menu a:focus, #menu a:active{ background-color: #EF9C00; display: block; }[/code:1:90cf5f24c0]Niet getest in IE... - Bas Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 Helaas, het heeft niet geholpen. Trouwens wel vreemd dat die border op 2 manieren werkt. Maar het werkt dus nog niet, ik kan wel een hidden li ervoor zetten, maar dat vind ik nou niet echt een goede oplossing. Hoop dat iemand anders misschien nog een idee heeft. Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 [url=http://tantek.com/CSS/Examples/boxmodelhack.html]Rekening mee gehouden?[/url] Quote Link naar reactie
anoniem Geplaatst: 19 februari 2004 Auteur Delen Geplaatst: 19 februari 2004 Op mijn disk gezet en even gekeken, het is heel vreemd, als ik #menu verander in: [code:1:7c094cc08b] #menu{ /* position:relative; top:0px; left:0px; height:200px;*/ width:190px; border:10px solid #FF7F02; }[/code:1:7c094cc08b] dus zonder position dan is de eerste link goed, maar is er een hover probleem. Ergens klopt er iets niet :cry: (aleen IE, met Mozilla is het steeds goed) wimb Quote Link naar reactie
anoniem Geplaatst: 20 februari 2004 Auteur Delen Geplaatst: 20 februari 2004 [quote:50b8ad45a7="termin8or"]Rekening mee gehouden?[/quote:50b8ad45a7] Ik zie niet echt hoe dat stukje voor mijn probleem gebruikt kan worden, misschien mis ik iets, zo ja help me plz. :D Quote Link naar reactie
anoniem Geplaatst: 21 februari 2004 Auteur Delen Geplaatst: 21 februari 2004 Op de volgende manier werkt het in IE, Firefox en Mozilla [code:1:cff11a8ee9] #menu { position:relative; top:0px; left:0px; width:190px; border:solid 10px #FF7F02; } #menu ul { margin: 0; padding: 5px; list-style-type: none; } #menu li a { display: block; padding:3px 5px 3px 10px; border:solid 1px #FF7F02; background-color:#FFD37D; color: #000000; text-decoration: none; margin-bottom:1px; width: 165px; } html>body #button li a { width: auto; } #menu li a:hover { background-color:#EF9C00; } [/code:1:cff11a8ee9] #menu li a width: 100% werkt alleen in IE niet in Firefox en Mozilla Quote Link naar reactie
anoniem Geplaatst: 21 februari 2004 Auteur Delen Geplaatst: 21 februari 2004 Ok het werkt en dank daarvoor!, maar snap nog niet helemaal waarom. Snap 2 onderdelen uit de code niet helemaal en ook niet waarom dat nou het verschil maakt. waarom staat die li tussen #menu en a wat doet dit precies? html>body #button li a { width: auto; } Quote Link naar reactie
anoniem Geplaatst: 21 februari 2004 Auteur Delen Geplaatst: 21 februari 2004 Maak daarvan:[code:1:d6762daf80]#button li>a{ width:auto; }[/code:1:d6762daf80]Werkt beter in IE5.0. Internet Explorer zal de child-selector (>) negeren en dus 'width:100%;' houden. Betere browsers krijgen 'width:auto;', omdat die 'display:block;' sowieso al correct ondersteunen. Quote Link naar reactie
anoniem Geplaatst: 25 maart 2004 Auteur Delen Geplaatst: 25 maart 2004 [quote:4ec04541fa="Struis"][url=http://www.vvmonnickendam.nl/ek2004]tada!!![/url] O enne volgens mij werkt het wel in mozilla, maar aangezien het grootste gedeelte toch IE gebruikt, is dat ook wel makkelijk[/quote:4ec04541fa] Nou, ik bekijk het net in Mozilla Firefox en zie toch dat de brede border om "VVMonnickendam poule" wat te hoog uitkomt. Het sluit nu niet meer mooi aan op het logo aan de rechterkant en ik denk toch dat dat wel de bedoeling is geweest, Quote Link naar reactie
Aanbevolen berichten
Om een reactie te plaatsen, moet je eerst inloggen