Hi, need some help and advice.
I have an app with some components and I want to change, not the size of the components but the space between them. Hopefully the picture below helps.
I playing around with CSS and I can’t figure out how to make it work.
I tried to illustrate my problem with the images below. The image on the left show what part of the page is highlighted when I select the image component. The image on the right show that when I inspect the page, the container that creates the gap between components seems to be outside of the scope of the component. I can’t figure out a CSS that I an attach to the component and select the parent wire_container element of the page and change its properites.
As usual, all help appreciated.
In your case, it’s easier to use the rich text component with inline CSS rather than custom CSS.
Sorry, I need a lot more detail. Can you please elaborate? An example would be great. I’m not sure I see how that would change the gap between components.
You could write HTML using a template column that contains everything you want in the layout you want, with the exception of the button block. Rather than separate components for everything, you would use a single Rich Text component to display your HTML template, which could be set up to display your images and text the way you want.
Ahhh. I think I understand it. Thank you.
1 Like
Replace your text component with a richtext component and provide the following HTML code, then you can easily set the spacing you want.
<div style="height: 0px; text-align: center; padding-bottom:10px;">5 KTS</div>
1 Like
Have you tried using a Separator component?
Great point. I should have been more clear. I’m trying to reduce it out eliminate it, not increase it. Sorry got the confusion.
