Skip to content

g_Document Reflow and Z Index

Mohammed David edited this page Aug 28, 2025 · 2 revisions

Document Reflow and Z-Index

Return to 'Introduction to the HW HTML Drafting Project'

One Large Star Centred on a Ribbon

You are in luck! And if you are looking for a quick reference, here is one now!

Here is a reference for V and Z, which gives document reflow and z-index

The V key is always the same and will reflow the complete document.

If you use shift + V you will reflow the whole document but also give preference to the colour groups, i. e. anything in the grey group will be at the top(ordered within the group), then likewise pink, then blue.

Z-Order Diagram 2

Right? Next thing:

The Z key works in construction mode only! That is when the caps-lock key is turned on. It will set all of the "z" index values in the document, if not set already, and it might reverse them if you press it a second time.

The shift + z key will set the z-index also, across the whole document, only it will respect the colour groups. First Pink, then Grey, then Blue.

Z-Order Diagram

That ordering is not the same as the ordering that will be given when you re-flow the document using shift + V. This is because of a fairly obvious preference that you will probably agree with.

Explaining the difference in preference between document flow and z-index

Essentially, and given in short, I will tell you that, because we have exactly three groups, Pink, Grey, and Blue, we have a very natural "Foreground", "Middleground", and "Background" that can be achieved.

From the visual perspective: Pink will become the background, Grey will become the middleground, and Blue will become the foreground. This is very useful because we will know exactly which of the three echelons the visual layers will be ending up in. Of course, we must use shift + V to get this triple effect.

Pink, Grey, Blue

Pink is the bottom, Grey is the middle, and Blue will be the top. Every Grey part will be above every Pink part, and every blue part will be above both Pink and Grey parts. I hope that this is written clearly, because this is a very important thing.

There is also single control to raise or lower the part

The single controls are available on the HJKL keys after we use Z while in construction mode.

Clone this wiki locally