Wie is er online?

Hoi,
de achtergrond van de tekst bij 'wie is er online' is niet de kleur paars zoals ik hem wil, kan ik deze aanpassen in de css?
zo ja, waar precies?
http://gemhearted.actieforum.com <- voorbeeld.

Je kunt in het template een div class toevoegen hieraan en dan via de CSS het aanpassen.
Display > Templates > General > index_body

Ergens onderaan in dit template staat het volgende:

Code:

<td class="catHead" colspan="2" height="28">
 <!-- BEGIN switch_viewonline_link -->
 <span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
 <!-- END switch_viewonline_link -->

Je kunt de span veranderen naar een div met een class naar keuze en deze aanduiden in de CSS code.
Let wel op dat je de link aanduid en niet enkel de div! (dus .cattitle a { blabla } )
Anders werkt het alsnog niet.

Hopelijk was dit een beetje duidelijk, mijn uitleg skills zijn niet zo goed ^^'

Code:

.cattitle a {
text-shadow: 0.1em 0.1em #333;
font-size: 18px;
color: #fff;
background-color: #8F3E4A;
position: relative;
}

dit is nu m'n css code, maar hij doet maar een klein deel van het who is online verkleuren (kijk voor voorbeeld weer op het forum ^^)
Wat klopt er nu precies niet aan?

Wat je wilt eigenlijk wilt doen is een hele cel kleuren, maar als je '.cattitle a' gaat gebruiken kleur je enkel je link. Het is dus de bedoeling om heel het vlak te kleuren dus moet je hoger gaan kijken in je html-tree (de html structuur).

Een element hoger is een div. Deze zou al beter zijn, want een div is een block element en dus gaat het meer kleuren. In dit geval is het echter nog niet voldoende want dan hebben we boven en onderaan nog een kleine ongekleurde rand (de padding van de cel).



Om het echt goed te krijgen moeten we nog een stap naar boven. Nu komen we terecht bij een td-element, dit is een tabelcel. Eerder zeiden we al dat we de cel wouden kleuren dus als we deze selecteren in onze css kunnen we ze een achtergrondkleur geven die heel de cel kleurt.

Code:

td.catHead {background-color: #8F3E4A;}

Er zat een foutje in je code, maar na de tweede background weggehaald te hebben klopt hij ^^
Wat ik me nu nog afvraag, ik wil de tekst van wie is er online in het midden en wit, maar dat doet hij helaas niet. De code die ik nu heb in de css:

Code:

td.catHead {
  background-color: #8F3E4A;
  font-size: 25px;
  text-shadow: 0.1em 0.1em #333;
  text-color: #fff;
  position: relative;
}

Aww, zo een foutjes heb ik wel vaker. Dat is omdat ik kopieer en plak vanuit de editor.
Ik heb ook gezien dat je je template aangepast hebt voor inline css, dat was niet echt nodig. Ik had de editor getoond zodat je ziet wat er gebeurd.

---

Ik vermoed dat je de tekst 'Wie is online' hetzelfde wilt hebben als je categorietitels?

Je ziet dat ik hier twee elementen aanspreek in de css. De eerste catHead gebruik ik voor de blok opmaak, hiermee bedoel ik: achtergrondkleur, tekstuitlijning (evt padding, margin, position ...)
De tweede is de cattitle, dit is de link en werkt enkel op de tekst zelf dus hier zet ik de tekstopmaak: tekstkleur, lettergrootte, tekstbreedte, schaduw (evt lettertype ...)
Verder kan je zien dat ik rechts van de codes een beetje uitleg heb gezet zodat je weet wat ze doen en wat en hoe je ze aanpast. De !important dat je ziet staan is om problemen met de hover te verkomen.

Code:

td.catHead {
  background-color: #8F3E4A;
  text-align: center; /* tekstuitlijning: left, right, justify, center */
}
a.cattitle[href*="/viewonline"] {
  color: #ffffff !important; /* tekstkleur */
  font-weight: 700; /* tekstbreedte */
  text-decoration: none !important; /* tekstdecoratie: underline, overline, line-through */
  font-size: 25px; /* lettergrootte */
  text-shadow: .1em .1em #333 !important; /* tekstschaduw, rechts onder diffusie kleur */
}

Verder kan je ook googelen als je vast loopt met je css codes. Typ gewoon de handeling + css in google vb 'css tekstkleur' en je komt er wel. Verder kan je ik je ook w3schools aanraden om codes op te zoeken.

Ah oké! Bedankt voor de uitleg, daar heb ik heel veel aan (: want ik wil zelf ook gaan coderen en zulke tips helpen daar echt heel erg bij. Dankjewel! De code werkt inderdaad precies zoals ik hem hebben wil.