ContextPad format

I followed the bpmn-examples fro custm-elements, except my contextpad has a different organization than the one in the example (the original one).
could there be a reason for this?
I would like it to be in its original form.

And this is how the change type menu looks like, it also looks strange.

Any help would be appreaciated.

Did you forget to attach screenshots?

I hadn’t forgotten. But i added them again.
The links were broken.

There seems to be an issue with CSS. Are you using any other CSS on your page that might interfere with the context pad?

If I add text-align: center to the CSS I get a similar result:

Yes you were right about that. That solved my issue of the format.

but for the custom icon i added to the custom pad, is there any way to position it where i want to?

It still is touching the icon to its left.

The icon pointed by the arow.

There seems to be an issue with the size of the icon. What icon are you using and how?

I’m using the fa-cogs icon from font-awesome.

Okay, then it’s an issue with the size of the icon that you somehow need to fix using CSS. The other icons in the context pad are all part of the BPMN font.

Yes i know, i tried.
But i didn’t work out.
Which is why i checked a way to maybe change the position.

But i will keep trying i guess.