Joomla!NL - [opgelost] Google Fonts

Google Fonts

27 feb 2021 17:35 - 27 feb 2021 17:58

#1

Dag,

Ik heb op www.wytsmeilink.nl/cv-wyts.html styling aangebracht zodat ik 3 kolommen heb
De kolom-koppen moeten zijn: 'Wyts Meilink', 'Opleiding' en 'Exposities'

Als editor gebruik ik =CodeMirror.
Dit is de code die ik in het artikel gebruik:

Code:

<div class="coll">
  
  
<p><span style="font-family: 'Merriweather', serif; font-size: 18px;"> Wyts Meilink </span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">wonend en werkend in Zwolle</span></p>


<p><span style="font-family: 'Merriweather', serif; font-size: 18px;">Opleiding</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">2016-2021 Nieuwe Akademie Utrecht (NAU)</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">deeltijd kunstacademie voor beeldende kunsten</span></p>

  
<p><span style="font-family: 'Merriweather', serif; font-size: 18px;">Exposities</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">2021:</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">Eindexpositie Nieuwe Akademie Utrecht</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">Loods 6, 27 juni t/m 5 juli, Amsterdam</span></p>

  </div>




<style>
.coll {
  column-count:3;
  column-width: auto;
  height: 300px;
  background:linear-gradient(#808080, #DCDCDC);
  color: #ffffff; 
    </style>
  

Vraag is hoe ik de boven beschreven koppen vast kan zetten.
Een pagebreak lijkt me logisch, maar ik weet niet hoe.

M.vr.gr. Jan A
Edit Astrid: Ik heb de code tussen tags geplaatst, volgende keer graag zelf doen.

jana
Heeft onderwerp gestart
Joomla!NL ontdekker
Berichten: 23

Google Fonts

27 feb 2021 18:14 - 27 feb 2021 18:19

#2

Ik zou het of oplossen met 3 modules op de posities 9, 10 en 11 of gewoon kiezen voor een blogweergave met 3 kolommen. Met een paginaclass suffix kan je dan de titels met css stylen.
Wat je nu probeert te doen is niet echt handig en werkt ook niet op mobiele weergaven.
In principe zo min mogelijk inline styling gebruiken (behalve eventueel vet en cursief).

Groetjes, Astrid

Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725

Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Astrid
Moderator + Technisch team
Berichten: 37431

Google Fonts

27 feb 2021 18:17 - 27 feb 2021 18:18

#3

Allereerst heb je vergeten de .Coll { te sluiten met een }
Als pagebreak zou je <br/> kunnen nemen.

Of de blokken in afzonderlijke div's zetten, zoals hieronder:

Code:

<div class="coll">
  
<div class="coll"1>
<p><span style="font-family: 'Merriweather', serif; font-size: 18px;"> Wyts Meilink </span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">wonend en werkend in Zwolle</span></p>
</div>
  <div class="coll2">
<p><span style="font-family: 'Merriweather', serif; font-size: 18px;">Opleiding</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">2016-2021 Nieuwe Akademie Utrecht (NAU)</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">deeltijd kunstacademie voor beeldende kunsten</span></p>
</div>
<div class="coll3">
<p><span style="font-family: 'Merriweather', serif; font-size: 18px;">Exposities</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">2021:</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">Eindexpositie Nieuwe Akademie Utrecht</span></p>
<p><span style="font-family: 'Open Sans', serif; font-size: 14px;">Loods 6, 27 juni t/m 5 juli, Amsterdam</span></p>
[color=red]</div>[/color]
  </div>




<style>
.coll {
  column-count:3;
  column-width: auto;
  height: 300px;
  background:linear-gradient(#808080, #DCDCDC);
  color: #ffffff; 
}

.coll1, .coll2, .coll3 {
height: 300px;
}
    </style>

pjasmits
Bekend met Joomla!NL
Berichten: 177

Google Fonts

28 feb 2021 09:28

#4

Zal ik doen.

jana
Heeft onderwerp gestart
Joomla!NL ontdekker
Berichten: 23

Google Fonts

28 feb 2021 09:33

#5

Dag Pjasmits,

Ik had deze mogelijkheid al geprobeerd, maar heb nu de style aangepast naar jouw voorbeeld.
Helaas.
Ik zou overigens inderdaad <br> kunnen gebruiken om de kolomkop naar de juiste positie te dwingen, maar dan ontstaat een probleem met het responsive-karakter.
Hoe dan ook: dank voor je reactie.
Gr. JanA

jana
Heeft onderwerp gestart
Joomla!NL ontdekker
Berichten: 23

Google Fonts

28 feb 2021 09:47

#6

Dag Astrid,

Ik heb weinig ervaring met de categorieblog en een filmpje van Mindert Aardema brengt me wat dit betreft niet veel verder.
Je idee om 3 modules naast elkaar te plaatsen werkt daarentegen erg goed.
Ik heb trouwens geen idee hoe je kon zien dat in mijn template die bewuste posities zitten.
Hoe dan ook; het werkt. Het enige probleem is dat de genoemde posities onderin de template staan.
Ik ga daarom aan de gang met drie nieuwe posities in de template te maken.
Dankjewel.

jana
Heeft onderwerp gestart
Joomla!NL ontdekker
Berichten: 23

Laatste nieuws

Welkom bij Joomla!NL

opgelost Google Fonts

Google Fonts

Google Fonts

Google Fonts

Google Fonts

Google Fonts

Google Fonts

Laatste forumberichten

Wil je Joomla!NL steunen?