login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Css dummie-vraag hoe pas ik deze code aan?

Offline macaddit - 02/07/2012 14:17 (laatste wijziging 02/07/2012 14:18)
Avatar van macadditLid Beste mensen,

Ik heb niet veel kennis van css, ik zit met een probleem ik wil een kalander gebruiken in mijn wordpress website. Ik heb een plugin gevonden alleen is de kalander te groot. Ik heb de mogelijke om de css aan te passen in wordpress. De grote van de kalander die ik nodig heb is 570 px bij 292 px
Wie zou mij kunnen vertellen wat ik moet aanpassen omdat gewenste effect te bereiken?

css code - Bekijk de code zonder highlighting - Klap code in 
  1. .calnk a:hover {
  2.         background-position:0 0;
  3.         text-decoration:none;  
  4.         color:#000000;
  5.         border-bottom:1px dotted #000000;
  6.      }
  7.     .calnk a:visited {
  8.         text-decoration:none;
  9.         color:#000000;
  10.         border-bottom:1px dotted #000000;
  11.     }
  12.     .calnk a {
  13.         text-decoration:none; 
  14.         color:#000000; 
  15.         border-bottom:1px dotted #000000;
  16.     }
  17.     .calnk a span { 
  18.         display:none; 
  19.     }
  20.     .calnk a:hover span {
  21.         color:#333333; 
  22.         background:#F6F79B; 
  23.         display:block;
  24.         position:absolute; 
  25.         margin-top:1px; 
  26.         padding:5px; 
  27.         width:150px; 
  28.         z-index:100;
  29.         line-height:1.2em;
  30.     }
  31.     .calendar-table {
  32.         border:0 !important;
  33.         width:100% !important;
  34.         border-collapse:separate !important;
  35.         border-spacing:2px !important;
  36.     }
  37.     .calendar-heading {
  38.         height:25px;
  39.         text-align:center;
  40.         border:1px solid #D6DED5;
  41.         background-color:#E4EBE3;
  42.     }
  43.     .calendar-next {
  44.         width:25%;
  45.         text-align:center;
  46.     }
  47.     .calendar-prev {
  48.         width:25%;
  49.         text-align:center;
  50.     }
  51.     .calendar-month {
  52.         width:50%;
  53.         text-align:center;
  54.         font-weight:bold;
  55.     }
  56.     .normal-day-heading {
  57.         text-align:center;
  58.         width:25px;
  59.         height:25px;
  60.         font-size:0.8em;
  61.         border:1px solid #DFE6DE;
  62.         background-color:#EBF2EA;
  63.     }
  64.     .weekend-heading {
  65.         text-align:center;
  66.         width:25px;
  67.         height:25px;
  68.         font-size:0.8em;
  69.         border:1px solid #DFE6DE;
  70.         background-color:#EBF2EA;
  71.         color:#FF0000;
  72.     }
  73.     .day-with-date {
  74.         vertical-align:text-top;
  75.         text-align:left;
  76.         width:60px;
  77.         height:60px;
  78.         border:1px solid #DFE6DE;
  79.     }
  80.     .no-events {
  81.  
  82.     }
  83.     .day-without-date {
  84.         width:60px;
  85.         height:60px;
  86.         border:1px solid #E9F0E8;
  87.     }
  88.     span.weekend {
  89.         color:#FF0000;
  90.     }
  91.     .current-day {
  92.         vertical-align:text-top;
  93.         text-align:left;
  94.         width:60px;
  95.         height:60px;
  96.         border:1px solid #BFBFBF;
  97.         background-color:#E4EBE3;
  98.     }
  99.     span.event {
  100.         font-size:0.75em;
  101.     }
  102.     .kjo-link {
  103.         font-size:0.75em;
  104.         text-align:center;
  105.     }
  106.     .calendar-date-switcher {
  107.         height:25px;
  108.         text-align:center;
  109.         border:1px solid #D6DED5;
  110.         background-color:#E4EBE3;
  111.     }
  112.     .calendar-date-switcher form {
  113.         margin:2px;
  114.     }
  115.     .calendar-date-switcher input {
  116.         border:1px #D6DED5 solid;
  117.         margin:0;
  118.     }
  119.     .calendar-date-switcher select {
  120.         border:1px #D6DED5 solid;
  121.         margin:0;
  122.     }
  123.     .calnk a:hover span span.event-title {
  124.         padding:0;
  125.         text-align:center;
  126.         font-weight:bold;
  127.         font-size:1.2em;
  128.         margin-left:0px;
  129.     }
  130.     .calnk a:hover span span.event-title-break {
  131.         width:96%;
  132.         text-align:center;
  133.         height:1px;
  134.         margin-top:5px;
  135.         margin-right:2%;
  136.         padding:0;
  137.         background-color:#000000;
  138.         margin-left:0px;
  139.     }
  140.     .calnk a:hover span span.event-content-break {
  141.         width:96%;
  142.         text-align:center;
  143.         height:1px;
  144.         margin-top:5px;
  145.         margin-right:2%;
  146.         padding:0;
  147.         background-color:#000000;
  148.         margin-left:0px;
  149.     }
  150.     .page-upcoming-events {
  151.         font-size:80%;
  152.     }
  153.     .page-todays-events {
  154.         font-size:80%;
  155.     }
  156.     .calendar-table table,tbody,tr,td {
  157.         margin:0 !important;
  158.         padding:0 !important;
  159.     }
  160.     table.calendar-table {
  161.         margin-bottom:5px !important;
  162.     }
  163.     .cat-key {
  164.         width:100%;
  165.         margin-top:30px;
  166.         padding:5px;
  167.         border:0 !important;
  168.     }
  169.     .cal-separate {
  170.        border:0 !important;
  171.        margin-top:10px;
  172.     }
  173.     table.cat-key {
  174.        margin-top:5px !important;
  175.        border:1px solid #DFE6DE !important;
  176.        border-collapse:separate !important;
  177.        border-spacing:4px !important;
  178.        margin-left:2px !important;
  179.        width:99.5% !important;
  180.        margin-bottom:5px !important;
  181.     }
  182.     .cat-key td {
  183.        border:0 !important;
  184.     }

3 antwoorden

Gesponsorde links
Offline larssy1 - 02/07/2012 14:33
Avatar van larssy1 MySQL beginner bij een logische volgorde zou ik denken dat je moet kijken bij deze tag: calendar-table

het makkelijkst om dit te doen is te gaan kijken mbv van de element viewer van chrome of firebug van firefox.

Hiermee kun je direct de code aanpassen en live de output bekijken, als je je oplossing hebt, echter niet vergeten de code op te slaan, de code die je veranderd via de viewer is niet permanent en geld zolang je op de pagina blijft, en alleen voor JOUW pc.
Bedankt door: macaddit
Offline macaddit - 02/07/2012 15:05
Avatar van macaddit Lid Geweldige tip het is gelukt ! bedankt voor deze handige tip!
Offline Pieter - 02/07/2012 17:05
Avatar van Pieter Gouden medaille

SEO guru		 Nu nog even drukken op "antwoord" of "bedank poster!" bij het juiste antwoord van Larssy1 en dan verdwijnt dit topic naar het archief. 
Bedankt door: macaddit
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.18s