Samenvatting
Waar een element staat en wat er voor of achter komt, zet je met twee dingen. De groep Positie regelt de plaats, en het veld Diepteniveau regelt de laag.
Twee losse velden horen er ook bij. Uitlijning staat in de groep Typografie. Overloop staat in de groep Weergave.
Een blok kan je niet los positioneren. Het heeft wel een laag, maar geen enkel plaatsveld.
Wanneer gebruik je dit?
Je gebruikt deze velden als de plaats of het stapelgedrag van een element anders moet. Vier situaties komen het vaakst voor.
- twee elementen moeten bewust over elkaar heen liggen
- een knop is niet klikbaar, want er ligt iets over
- je tekst valt achter een beeld
- een overlap ontstaat alleen op een klein scherm
Je komt hier ook zoeken wat een keuze doet, bijvoorbeeld bij het veld Overloop. Dat staat in de overzichtstabel hieronder.
Hoe werkt dit in Mach3Blocks?
Je selecteert je element en opent het tabblad Opmaak. De groep Positie staat als laatste in de lijst.
Los positioneren gaat in twee stappen. Eerst kies je een positiesoort, en daarna zet je de afstand tot een of meer zijden.
| Keuze bij Positie | Wat je element doet |
|---|---|
| Statisch | het staat in de gewone stroom van je pagina, en de vier afstandsvelden doen niets |
| Relatief | het houdt ruimte op zijn eigen plek en schuift van daaruit op |
| Absoluut | het verlaat de stroom van je pagina en houdt geen ruimte meer op zijn eigen plek |
De laagvolgorde
Diepteniveau is een getalveld zonder eenheid. Een hoger getal legt je element voor een element met een lager getal.
Laat je het leeg, dan staat er de grijze tekst Automatisch. De volgorde op je pagina bepaalt dan de laag.
De laagvolgorde werkt binnen dezelfde structuur. Twee elementen in verschillende blokken vergelijk je dus niet met dit getal.
Er zijn ook knoppen om een element naar voren of naar achteren te halen. Dat is de snelle weg; dit veld is de precieze.
Overloop
Overloop bepaalt wat er gebeurt zodra je inhoud buiten haar vak valt. Het veld staat in de groep Weergave.
Overloop is het enige opmaakveld zonder de knop Schermgrootte waarde toevoegen. Je kunt dit gedrag dus niet per schermgrootte anders zetten.
Alle andere velden van dit artikel hebben die knop wel. Lees Opmaak per schermgrootte.
De veldnaam zelf is ook een menu, het veldmenu. Daarin zet je een waarde terug of een niveau hoger. Lees Opmaakniveaus.
Twee velden die Uitlijning heten
Bij een kop, een tekst, een knop, een nummer en een handler lijnt Uitlijning je tekst uit. Bij een kolom, een box en een card is het een tweede veld met dezelfde naam.
Op een card staat een uitlijningsveld in de groep Typografie en staan er twee in de groep Lay-out. Wat die twee doen, staat in Lay-out.
Wat hier niet staat
Het veld Overlap staat niet in deze groepen. Je vindt het in de vormen van een zijde. Lees Vormen en ronde hoeken.
Overzichtstabel met opties, waarden en standaard
De groep Positie
| # | Veld | Wat het zet | Keuzes en waarden | Standaard |
|---|---|---|---|---|
| 1 | Positie | de positiesoort | Statisch, Relatief, Absoluut | Statisch |
| 2 | Boven | de afstand tot de bovenkant | getal met negen eenheden, ook negatief | Automatisch |
| 3 | Onder | de afstand tot de onderkant | getal met negen eenheden, ook negatief | Automatisch |
| 4 | Links | de afstand tot de linkerkant | getal met negen eenheden, ook negatief | Automatisch |
| 5 | Rechts | de afstand tot de rechterkant | getal met negen eenheden, ook negatief | Automatisch |
| 6 | Diepteniveau | de laag waarin je element ligt | een getal, zonder eenheid en zonder grens | Automatisch |
Wat elke eenheid volgt, staat in Ruimtes.
De twee velden in een andere groep
| Veld | Groep op het scherm | Keuzes | Standaard |
|---|---|---|---|
| Uitlijning | Typografie | Links, Midden, Rechts, Uitvullen | Links |
| Overloop | Weergave | Zichtbaar, Verborgen, Scrollen, Automatisch | Zichtbaar |
Uitlijning is een knoppenrij van vier en geen keuzelijst. Elke knop draagt een pictogram.
Waar de velden staan
| Veld | Waar je het vindt |
|---|---|
| Diepteniveau | overal behalve bij een pagina, een handler en een viewport |
| Positie, Boven, Onder, Links, Rechts | overal behalve bij een pagina, een blok, een handler en een viewport |
| Overloop | blok, box, card, knop, icoon, nummer, control |
| Uitlijning in de groep Typografie | kop, tekst, knop, nummer, handler, en ook kolom, box en card |
Aanbevolen instelling
Er is geen plaats die overal goed is. Wat hieronder staat, is wat het platform zelf doet.
| Veld | Standaardwaarde |
|---|---|
| Positie | Statisch |
| Boven, Onder, Links, Rechts | Automatisch, dus geen eigen afstand |
| Diepteniveau | Automatisch, dus de volgorde op je pagina beslist |
| Overloop | Zichtbaar |
| Uitlijning | Links |
Het product geeft zelf twee regels. Los eerst je structuur en je positie op, en pas daarna je laagvolgorde.
En gebruik overlap als accent en niet als indeling. Een pagina die op overlap leunt, valt op een klein scherm sneller uit elkaar.
Voorwaarden en rechten
Je hebt het recht Websites/presentaties stijlen nodig. Zonder dat recht is er geen tabblad Opmaak, en dus geen enkel opmaakveld.
Welke rol dit recht standaard heeft, staat in Thema uitgelegd.
Gevolgen bij verkeerd instellen
Twee klachten over deze velden komen het vaakst voor.
Een knop is niet klikbaar. Er ligt dan een ander element over die knop heen, vaak een leeg vak zonder zichtbare inhoud.
Je tekst valt achter een beeld. Je beeld ligt dan in een hogere laag, of het staat later op je pagina.
Zet je een element op Absoluut, dan houdt het geen ruimte meer. De elementen eronder schuiven naar boven, en dat is zelden wat je verwacht.
Overloop kun je niet per schermgrootte anders zetten. Controleer een overlap dus op elke schermbreedte voordat je publiceert.
Een gewijzigde waarde staat meteen in Mach3Blocks. Op je live website verandert zij pas nadat je opnieuw publiceert.