Kaevon Zanjani asked 2 years ago
Hi, I am trying to change the width of the success message container. Currently, it is very long and I want it to be significantly shorter as it interferes with the graphic on my page.
Page Link: https://schallertenterprises.com/cutter-travel-calculator/ (ENTER VALUES: 23, 42, 2)
Please login or Register to submit your answer
Is the computed graphic the success message or the Minimum Cutter message?
The "minimum cutter: " is the success message.
I would probably do it by modifying the css. I think its:
.with_frm_style .frm_message, .frm_success_style {
margin: 5px 0 15px;
border: 1px solid #D6E9C6;
border-color: var(--success-border-color);
background-color: #DFF0D8;
background-color: var(--success-bg-color);
color: #468847;
color: var(--success-text-color);
border-radius: 4px;
border-radius: var(--border-radius);
font-size: 14px;
font-size: var(--success-font-size);
}
That the default css (I think).
Do I paste the css in the formidable css styling page or custom css?
You can put it in either one, you just need to change that css to reflect how you want it to look.
Ah ok I got it to work. One more quick question. When I hit submit/computer and the success message shows up, it moves my custom graphic down with it a little bit. Is there any way to prevent that?
<p>Could be a padding or a margin issue. It’s hard to tell from my phone.</p>
I don't see any padding properties though. and I removed the margin layout class and nothing happened.
What i have noticed is the entire graphic moves as it draws, looks like its using CSS Flex, which it probably needs too. I am not sure you want to change it to anything other than flex, for mobility reasons.