DecSoft Support - Image. How to align it vertically in the middle of the screen ?

Hi,
I have an image W 175 and H 330 on the View called
Credits.
I have to always align in the middle of the screen
this image.
So when screen changes the image must be always in the middle,
perfectly vertically aligned.

This is the code to keep it fixed (with no stretching)
and it is working well.

Just click on the View called Credits
click once on the View and then go to Code.
At the bottom of the View click on the Show tab
and copy the following script:

GetStyle "ImageCredits" "width" "[ImgWidth]"<br>GetStyle "ImageCredits" "height" "[ImgHeight]"</p>
<p>// Set the style, therefore the image is not scaled</p>
<p>SetStyle "ImageCredits" "width" "175px"<br>SetStyle "ImageCredits" "height" "330px"

Now the problem is to align it vertically in the middle
of the screen.

So when screen changes the image must be always in the middle,
perfectly vertically aligned.

Thanks
Joseph Caristena

decsoft

Hello Joseph,

One possible way to do what you wanted is to using the below CSS code, for example, in the "Inline CSS" app's option:

#ImageCredits<br>{
  top: 50%;<br>  left: 50%;<br>  width: 200px;<br>  height: 200px;<br>  position: absolute;<br>  margin-top: -100px; /* Half the height */<br>  margin-left: -100px; /* Half the width */<br>}

Note that doing that you no need to change the image width nor height.

Purchase one or more licenses of our products if they are useful to you!

Joseph Caristena

Hi,
Works well:)

Thanks
Joseph Caristena

Everybody can read the DecSoft support forum for learning purposes, however only DecSoft customers can post new threads. Purchase one or more licenses of some DecSoft products in order to give this and other benefits.