Fabio Correia
Hi,
During the implementation of some screens using Spark UI Toolkit we found that inputs and outputs don’t have the same vertical alignment, if you look at the attached image the labels are correctly aligned but the value part is not.
The output text value should be aligned at the center of the input value box, this way when the user looks to the screen looks like the input field is larger or lower then the output fields.
If we look how bootstrap works they do this alignment (second image attached), do we have any configuration that allow us to align inputs and outputs inside a layout or in any other way?
Best Regards,
Fabio Correia
SPARK Support
Hi Fabio,
The Output text has no CSS class to adjust, but you can add a class individually to each control under the HTML Attributes Property. See the attached screenshot where I have added the class “allignedOutput” to the control. I can then paste the following style into a Custom HTML control on the Service:
<style>
.allignedOutput>.form-group>.input {
padding-top: 6px;
}
</style>
With this approach, I can also programmatically add a class to the control rather than using the HTML Attributes. See attached screenshot using me.addClass(“alignedOutput”)
Regards,
Stephen P.
