login  Naam:   Wachtwoord: 
Registreer je!
 Forum

link css probleem

Offline lau - 17/04/2006 21:14 (laatste wijziging 17/04/2006 23:23)
Avatar van lauHTML interesse Zit met een raar hyperlink css probleem.
In Firefox laat ie mooi wit zien, maar in IE laat ie blauwe kleur zien.
Mijn code
  1. /*********** standaard hyperlink styles ***********/
  2. a:link, a:visited, a:active {
  3. font-family: verdana, arial, helvetica, sans-serif;
  4. color: #335eb3;
  5. text-decoration: none;
  6. }
  7. a:hover {
  8. font-family: verdana, arial, helvetica, sans-serif;
  9. color: #003399;
  10. text-decoration: underline;
  11. }
  12. /******* navigatie style *******/
  13. a.dd_button {
  14. text-decoration: none;
  15. color: #FFFFFF;
  16. font-weight: bold;
  17. padding: 2px 5px;
  18. }
  19. a.dd_button:hover {
  20. /*background-color: #FFFFFF;*/
  21. color: #DFBD4E;
  22. text-decoration: none;
  23. font-weight: bold;
  24. }
  25. div.dd_dropmenudiv {
  26. position: absolute;
  27. top: 0;
  28. border: 1px solid #164a7f;
  29. border-bottom-width: 0;
  30. font-family: Arial, Helvetica, sans-serif;
  31. font-size: 11px;
  32. text-align: left;
  33. line-height: 18px;
  34. z-index: 100;
  35. background-color: #4ba5db;
  36. width: 150px;
  37. visibility: hidden;
  38. }
  39. div.dd_dropmenudiv a {
  40. width: 100%;
  41. display: block;
  42. text-indent: 8px;
  43. border-bottom: 1px solid #164a7f;
  44. padding: 2px 0;
  45. text-decoration: none;
  46. color: #FFFFFF;
  47. }
  48. div.dd_dropmenudiv a:hover {
  49. color: #F2AA30;
  50. background-color: #F5F5F5;
  51. text-decoration: none;
  52. }

Hij moet dus de standaard hyperlink style negeren en wit aangeven bij de dropdownmenu.
Probleem te zien op http://as.4dimension.nl/SITE/ in IE (in FF doet ie goed wat ie moet doen)...

4 antwoorden

Gesponsorde links
Offline Rens - 17/04/2006 23:35
Avatar van Rens Gouden medaille

Crew algemeen
http://www.w3sc...lasses.asp
En dan het stukje lezen wat bij "Anchor Pseudo-classes" staat.

Citaat:
Anchor Pseudo-classes

A link that is active, visited, unvisited, or when you mouse over a link can all be displayed in different ways in a CSS-supporting browser:

[..code..]

Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!

Note: a:active MUST come after a:hover in the CSS definition in order to be effective!!

Note: Pseudo-class names are not case-sensitive.
Offline lau - 18/04/2006 01:00 (laatste wijziging 18/04/2006 21:12)
Avatar van lau HTML interesse Ok... ik heb alvast de dd_buttons bewerkt naar wat hierboven staat en dat werkt in FF en IE.
Even een vraag los hiervan: is het niet een beetje onzinnig om 4 aparte links te plaatsen waarvan er 3: link, visited en active dezelfde zijn?

Maar ik heb zojuist een probleem met de dropdowndiv links.
Ze doen het niet goed (zie onderstaande code), ik zie niet zo snel waar het probleem zit. Zonder de extra visited, active link werkte ie goed in FF (in IE natuurlijk niet goed), maar na toevoeging werkt het in beide browsers 'anders'/niet goed.
  1. div.dd_dropmenudiv {
  2. position: absolute;
  3. top: 0;
  4. border: 1px solid #164A7F;
  5. border-bottom-width: 0;
  6. font-family: Arial, Helvetica, sans-serif;
  7. font-size: 11px;
  8. font-weight: bold;
  9. text-align: left;
  10. line-height: 20px;
  11. z-index: 100;
  12. background-color: #4BA5DB;
  13. width: 160px;
  14. visibility: hidden;
  15. letter-spacing: 1px;
  16. }
  17. a.dd_dropmenudiv:link {
  18. width: 100%;
  19. display: block;
  20. text-indent: 8px;
  21. border-bottom: 1px solid #164A7F;
  22. padding: 2px 0;
  23. text-decoration: none;
  24. color: #FFFFFF;
  25. }
  26. a.dd_dropmenudiv:visited {
  27. width: 100%;
  28. display: block;
  29. text-indent: 8px;
  30. border-bottom: 1px solid #164A7F;
  31. padding: 2px 0;
  32. text-decoration: none;
  33. color: #FFFFFF;
  34. }
  35. a.dd_dropmenudiv:hover {
  36. color: #F2AA30;
  37. background-color: #0d679d;
  38. text-decoration: none;
  39. }
  40. a.dd_dropmenudiv:active {
  41. width: 100%;
  42. display: block;
  43. text-indent: 8px;
  44. border-bottom: 1px solid #164A7F;
  45. padding: 2px 0;
  46. text-decoration: none;
  47. color: #FFFFFF;
  48. }
Offline Ontani - 18/04/2006 21:14
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
.dd_dropmenudiv a:active
probeer dat eens
zet .dd_dropmenudiv overal vooraan
Offline lau - 18/04/2006 21:32
Avatar van lau HTML interesse Hmm.. das vrij raar, nu doet ie het na vooropplaatsing van .dd_dropmenudiv in IE en FF evengoed. Maar waarom moet het bij .dd_button de links vooraan en bij dropmenudiv achteraan..
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.189s