There are two element on the page?


#1

pic-text.hype.zip (417.4 KB) There are two element on the page: an image element and a text block below. Image element scales to fit browser window. How to anchor text block to the bottom border of the image element so that the distance between image and text remains constant when browser window is scaled.
Here is an example of how it is has to look like.


#2

Hi igor,

Can’t see an example :wink:

Not sure I understand what you are wanting to do

D


#3

Sorry. Enclosed…


#4

nope still nothing. Are you trying to add an image? You can just drag the document you want to include over the text area when replying.

D


#5

pic-text.hype.zip (417.4 KB)


#6

Igor,

You have to do a little CSS.

Declare your font-size to be relative to the viewport size. Text by general nature only resizes on zoom not when the viewport size is changed.

pic-text copy.hype.zip (437.8 KB)

More info on Viewport Text here


#7

or was this what you were looking for?

sticky_text.zip (26.0 KB)

or this

sticky_text_2.zip (28.0 KB)


#8

I meant like example “sticky_text_2” with “New text New text New text” under the picture. If I change viewport size the text doesn’t overlap image element and sticks to the bottom of the image elemetn. It’s just what I wanted.

But how to make other objects below like other pictures not to overlap the upper image element when viewport size is changed?sticky_text_2.hype.zip (28.6 KB)