Vertical Alignment inside Container in Reactive APP

Dear friends


I have a reactive APP with a text inside a placeholder. The placeholder height is bigger than the text height and I need the text to be vertically aligned in the middle of the placeholder. How can I do this?


I tried placing the text inside a container with the fallowing CSS:

height: Fill;

vertical-align: middle;


but it doesn't work

Hi David,

Try to use this:

Daryna Kravets wrote:

Hi David,

Try to use this:

 

It's not working. I attached a Printscreen.

I also needed to align the datepickers (inside a different placeholder) to the right and can't do so.


David Roque wrote:

Daryna Kravets wrote:

Hi David,

Try to use this:

 

It's not working. I attached a Printscreen.

I also needed to align the datepickers (inside a different placeholder) to the right and can't do so.


 Hi David,

Can be possible to share html source screenshot.

Vijay M-

 

Hi David,

Seems to me that you are trying to align the text in the Title placeholder with the widgets in the Action placeholder. You can't to that with the Align Center widget since the 2 placeholders don't share a common div that you can access.

Best way to handle this is by creating a div in both placeholders with a fixed height and then use the Align Center widget. This will give you the visual style you seek.

Greetings,

Vincent

Still not working. Am I doing something wrong?

Solution


Hi,

I just noticed that its the wrong widget. You need to use Center Content instead of Align Center.


Greetings,

Vincent


edit: Just to clarify. With Align Center you can align multiple widgets on their center. With Center Content you can center your content in the middle of the container.

Solution

That's it. Problem solved. Thank you very much

On the right I have a placeholder with a container inside. I wanted to align the container (and all its content) to the right of this placeholder, buy when I change the container alignment to the right, it doesn't change anything

David Roque wrote:

On the right I have a placeholder with a container inside. I wanted to align the container (and all its content) to the right of this placeholder, buy when I change the container alignment to the right, it doesn't change anything

 

 This sounds like a separate issue. You need to use Text-Align-Right or something like that. If this didn't work then please create a new thread to separate the issues properly. 

ok. thanks