Vertical Align

Small challenge … I am using a (flashcard) program called Anki which uses html to layout data on the screens. I edited the card template to move a second field way down the screen as follows

{{Field 1}}
<hr>
<br>
<br>
<br>
<br>
{{Field 2}}

No problem it works and shows the second field at the bottom of the screen which is what I want.

But when I access the same record on my tablet the second field is in the middle of the screen. No good. So I guess there is a better way of doing this. Is there some way to vertically position the field by percentage?

Hi petercnx. Welcome to the forums. :slight_smile:

Using <br> to push elements down the page isn’t a good strategy. CSS is a better tool for layout. Could you say a bit more about the layout you want? There are techniques for sticking something to the bottom of the screen, for example, but it’s not clear if that’s what you actually want.

To try and explain more clearly I have uploaded two images. These show where I enter the code to move the template fields about and a screenshot of what I see on a PC and this is generally what I would like to reproduce on a tablet. On a tablet the words ‘pak galam’ appear in the middle of the screen and not at the bottom as the screenshot shows.

Does this help to explain the problem?

petercnx,

If you can create a working HTML/CSS page with the HTML and CSS code that you are using that demonstrates the problem on a PC and table, then we can help you solve the problem. We really can only provide guesses based on the screen shots.

Please click on the link in my signature for examples of how to prepare a working demo page.

Thanks.