Uniform positioning of objects based on screen size and amount of text in objects

#1 · June 6, 2019, 5:07 pm

Good day!
What is a simple way to make a responsive design - to automatically distribute objects vertically on the page, depending on the actual screen size?

1) So that the distance between the objects is formed the same vertically, regardless of the screen size of the device.

The picture is for some reason not inserted, so the link: http://orgpsiholog.com/example/allocation.png

2) So that the objects do not crawl over each other (as shown by the arrow in the screenshot), so that the font size is changed so that all the text is placed on the page.

Link: http://orgpsiholog.com/example/creeping.jpg

Link to the project in the current version: http://orgpsiholog.com/1

P.S.: @Luis, do I have access to insert pictures and attach files?

#2 · June 6, 2019, 6:25 pm

@Vadim

One option would be to assign (at Design time) or modify (at Run time) a large value for margin-bottom property of the Headline object.

Another would be to specify overflow-y:auto for the object (i.e. scrollbars when needed); easiest way is to set up a class with just this property:value ... and then assign this class at Design time (Properties >>> Advanced >>> css-class) to the object.

Vadim has reacted to this post.

#3 · June 6, 2019, 7:31 pm

easiest way is to set up a class with just this property:value ... and then assign this class at Design time (Properties >>> Advanced >>> css-class) to the object.

Thank you very much!
Unfortunately, I do not own CSS. Could you make an example based on this file?
http://orgpsiholog.com/example/TestUniformPositioning.neoapp

#4 · June 6, 2019, 10:35 pm

@vadim, please take a look here:
https://visualneo.com/forum/topic/responsive-design-for-website

And also here:
https://visualneo.com/forum/topic/page-scrolling

Regards.

Vadim has reacted to this post.

#5 · June 7, 2019, 6:25 am

Luis, thank you very much!!

I will study!

I propose to add to the program guide information about plugin commands that come with VisualNEO Web by default.

#6 · June 7, 2019, 6:54 am

I propose to add to the program guide information about plugin commands that come with VisualNEO Web by default.

I know it's necessary but VisualNEO Web is growing very fast.
We try to add enough samples and tutorials (thanks @gaev) and to answer any questions within hours here in the forum, but documentation is very time consuming. I hope it will be a question of time but, right now, we concentrate on additional functionalities. We are just beginning to see the possibilities!

Vadim has reacted to this post.

#7 · June 7, 2019, 7:01 am

It is very good! I am very happy to see the rapid development of VisualNEO Web!!

Uniform positioning of objects based on screen size and amount of text in objects - Forum

Uniform positioning of objects based on screen size and amount of text in objects