Community Tip - You can change your system assigned username to something more personal in your community settings. X
Hello,
I have a situation where I have an application "header" in a mashup, like so:
As you can see, the header is not really centered.
This is due to this hidden dropdown:
At the moment I have set the container that the dropdown (and button) are in as fixed width. This is because if I set it to responsive, the application header moves around as its container is growing and shrinking.
So basically what I want to accomplish is to have the header in the center of the screen in general regardless of what happens to the other widgets.
I realize this might cause some issues for people with smaller resolutions, but I hope it would be OK.
Hope to get some feedback on this.
Thanks,
Jens
Solved! Go to Solution.
Hello Jens,
How about adding a second similarly-fixed-width empty container to the left of your header?
/ Constantine
Hi @jensc.
Which version of ThingWorx are you running? I'll need to do some testing with this.
Regards.
--Sharon
Hello,
I am using 9.3.5 currently.
One option my colleague said we could perhaps use would be to add another container to the left of the header which is the same size as the one to the right of the header.
This will cause the header container to be centered and the text itself centered within it.
It's not a great solution perhaps, so if you have any thoughts I'd love to hear them.
Thanks,
Jens
Hello,
Ah, I forgot to write that in the original post.
This is a master that we are using.
For now it is not a huge issue so we will put it a little bit on the back-burner.
Of course any inputs are appreciated though.
Thanks,
Jens
Hi @jensc
Can you send me your Master so I can see what options and widgets you're using?
Thanks.
--Sharon
Hello Jens,
How about adding a second similarly-fixed-width empty container to the left of your header?
/ Constantine
Hello Constantine,
Yep, this was one of the way we discussed internally as well and I think it would be the easiest way to accomplish this.
However at the same time this could cause some issues for user with smaller resolutions. But for the majority of our users it should be fine.
Thanks,
Jens
Hi @jensc.
Apologies for the delay.
From the master you sent me, the container with the drop-down was set to responsive. I know you said you had it set to static, but can you confirm in your master?
We agree too that the best way to center the header is to also add a static container to the left.
Let me know if you have further questions.
Regards.
--Sharon
Hello @slangley
It is no problem.
I thought it was set to fixed size... The position of the container is set to responsive though.
In the end I ended up setting a similar sized container on the left side as @Constantine suggested and this works well, at least for people with screens of 1080p or higher.
Thank you for taking your time!
Thanks,
Jens